/* Brand attribution for DOM only. Never loaded into Canvas/Worker. */
.fa-brands.fa-youtube::before {
  content: "" !important;
  display: inline-block;
  width: 29px;
  height: 20px;
  vertical-align: -.07em;
  background: url('/assets/youtube-brand-mark.svg') center / contain no-repeat;
}
.youtube-brand-attribution {
  display: inline-flex; align-items: center; gap: .45em;
  color: inherit; text-decoration: underline; text-underline-offset: 2px;
}
.youtube-brand-attribution img { display: inline-block; width: 29px; height: 20px; object-fit: contain; flex: none; }
.youtube-brand-attribution:focus-visible { outline: 2px solid currentColor; outline-offset: 3px; }

/* Compact, centered two-line YouTube attribution and transparency. */
.youtube-api-inline{width:100%;max-width:100%;margin:7px auto 10px;padding:0 6px;box-sizing:border-box;border:0;background:transparent;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;text-align:center;color:#aca7bb;font-size:11px;line-height:1.45}
.youtube-api-inline-main,.youtube-api-inline-links{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:3px 7px}
.youtube-api-inline-main strong{font-size:11px;font-weight:650;color:#dfd8ed}
.youtube-api-inline-main .youtube-api-inline-brand{display:inline-flex;align-items:center;justify-content:center;flex:none}
.youtube-api-inline-brand img{width:29px;height:20px;object-fit:contain}
.youtube-api-inline .youtube-api-sep,.youtube-api-inline-links>span{opacity:.5}
.youtube-api-inline-links{font-size:10.5px}
.youtube-api-inline-links a{color:#b7a3d7;text-decoration:none;text-underline-offset:2px;white-space:nowrap}
.youtube-api-inline-links a:hover,.youtube-api-inline-links a:focus-visible{text-decoration:underline;color:#e6d3ff}
@media(max-width:600px){.youtube-api-inline{font-size:10px;padding:0 4px}.youtube-api-inline-main strong{font-size:10px}.youtube-api-inline-links{font-size:10px;gap:3px 6px}}

/* YouTube audit: minimum 20px mark height. The canvas sprites remain unchanged. */
.fa-brands.fa-youtube {display:inline-flex;align-items:center;justify-content:center;min-height:20px;vertical-align:middle;line-height:1}
.fa-brands.fa-youtube::before {flex:none;background-color:transparent;filter:none}
.sortix-youtube-input-brand {min-width:29px;min-height:20px;background-size:contain}
.youtube-api-inline-brand {min-height:20px}

/* One-line privacy disclosure, with detail panel removed from document flow. */
.youtube-api-mini{display:flex!important;flex-flow:row nowrap!important;align-items:center!important;justify-content:center!important;gap:7px!important;white-space:nowrap;min-height:22px!important;height:22px!important;line-height:1.3!important;padding:0 8px!important;margin:4px auto 6px!important;border:0!important;background:transparent!important;text-align:center;font-size:10.5px!important;color:#ada6be!important;box-sizing:border-box;overflow:visible!important}
.youtube-api-mini>span{overflow:hidden;text-overflow:ellipsis;min-width:0;white-space:nowrap}
.youtube-api-mini-details{position:relative;flex-shrink:0;display:block!important;margin:0!important;padding:0!important}
.youtube-api-mini-details>summary{list-style:none!important;cursor:pointer!important;color:#c3a5f6!important;text-decoration:underline!important;text-underline-offset:2px;white-space:nowrap;font-size:10.5px}
.youtube-api-mini-details>summary::-webkit-details-marker{display:none}
.youtube-api-mini-details>summary:focus-visible{outline:2px solid #a67bff;outline-offset:2px;border-radius:3px}
.youtube-api-mini-panel{position:absolute;top:calc(100% + 8px);left:50%;transform:translateX(-50%);z-index:90;width:min(550px,calc(100vw - 36px));white-space:normal!important;background:#16121f;border:1px solid #49335e;border-radius:10px;padding:12px 14px;box-sizing:border-box;text-align:left;color:#c6bdd2;font-size:12px;line-height:1.55;box-shadow:0 12px 38px #000a}
.youtube-api-mini-panel nav{display:flex;gap:6px 14px;flex-wrap:wrap;margin-top:9px}
.youtube-api-mini-panel a{color:#c9aaff;text-decoration:underline}
@media(max-width:650px){.youtube-api-mini{font-size:10px!important}.youtube-api-mini-panel{left:auto;right:0;transform:none}}

/* Header row shares available width with platform instructions, without affecting form height. */
.sortix-platform-info-row{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;column-gap:12px;row-gap:3px;margin:0 auto 8px;width:100%;position:relative}
.sortix-platform-info-row #beta-platform-helper{margin:0!important;width:auto!important;flex:0 1 auto}
.sortix-platform-info-row #youtube-api-notice{width:auto!important;max-width:100%;margin:0!important;padding:0!important;flex:0 1 auto;min-height:20px!important;height:auto!important}
.sortix-platform-info-row #youtube-api-notice[hidden]{display:none!important}
@media(max-width:700px){.sortix-platform-info-row{column-gap:6px}.sortix-platform-info-row #beta-platform-helper{font-size:10px!important}}
