/* UTM link oluşturucu */
.utm-presets__title { font-size: 14px; font-weight: 600; margin-bottom: 8px; }
.utm-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.utm-chip { border: 1px solid var(--cizgi); background: #fff; border-radius: 999px; padding: 9px 14px; font: 600 13px/1 var(--font-sans); color: var(--metin); cursor: pointer; transition: border-color .2s, background-color .2s; }
.utm-chip:hover { border-color: var(--c, var(--okyanus)); }
.utm-chip[aria-pressed="true"] { background: var(--grafit); border-color: var(--grafit); color: #fff; }

.utm-out { display: grid; gap: 16px; align-content: start; min-width: 0; }
.utm-result { padding: 20px; border-radius: 20px; background: var(--gece); color: #e6ecea; }
.utm-result__label { font: 600 12px/1 var(--font-sans); letter-spacing: .08em; text-transform: uppercase; color: rgba(255, 255, 255, .55); }
.utm-result__url { margin: 12px 0 16px; font: 14.5px/1.6 ui-monospace, SFMono-Regular, Menlo, monospace; word-break: break-all; }
.utm-q { color: rgba(255, 255, 255, .45); }
.utm-k { color: var(--isik); }
.utm-k--other { color: #9fb3c8; }
.utm-v { color: #fff; }
.utm-h { color: #f5b971; }
.utm-result__error { color: #ffb59a; font-family: var(--font-sans); }
.utm-result__actions { display: flex; flex-wrap: wrap; gap: 10px; }
.utm-result .btn--dark { background: var(--isik); color: var(--grafit); }
.utm-result .btn--dark:hover { background: #63e0c8; }
.utm-result .btn--outline { color: #fff; background: transparent; box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .3); }
.utm-result .btn:disabled { opacity: .45; cursor: not-allowed; }

.utm-channel:empty { display: none; }
.utm-channel { display: grid; gap: 2px; padding: 16px 18px; border: 1px solid var(--cizgi); border-radius: 16px; }
.utm-channel__label { font-size: 12px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--celik); }
.utm-channel strong { font: 600 22px/1.2 var(--font-display); color: #0b7a55; }
.utm-channel strong.is-bad { color: #c23d0b; }
.utm-channel span:last-child { font-size: 14px; color: var(--metin); }

.utm-qr { display: grid; gap: 16px; align-items: center; padding: 18px; border: 1px solid var(--cizgi); border-radius: 18px; }
@media (min-width: 420px) { .utm-qr { grid-template-columns: 150px 1fr; } }
.utm-qr canvas { width: 150px; height: 150px; image-rendering: pixelated; border-radius: 8px; }
.utm-qr .tool-section-title { margin: 0 0 4px; }
.utm-qr .btn { margin-top: 10px; }

.utm-history { margin-top: 36px; }
.utm-history__head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 12px; }
.utm-history__head .tool-section-title { margin: 0; }
.utm-history__actions { display: flex; flex-wrap: wrap; gap: 8px; }
.utm-history__actions .btn:disabled { opacity: .45; cursor: not-allowed; }
.utm-history__list { display: grid; gap: 8px; }
.utm-history__list li { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 12px; align-items: center; padding: 12px 16px; border: 1px solid var(--cizgi); border-radius: 14px; }
.utm-history__tags { display: block; font-size: 13px; font-weight: 600; color: var(--grafit); }
.utm-history__url { display: block; font: 13px/1.5 ui-monospace, SFMono-Regular, Menlo, monospace; color: var(--celik); word-break: break-all; }
.utm-history__list li.utm-history__empty { display: block; color: var(--celik); font-size: 14px; background: var(--sis); border-color: transparent; }
.utm-cta { margin-top: 32px; }
.tool-about code { overflow-wrap: anywhere; }