/* Twitch & Kick Username Generator — tool styles (scope .bvk-t-twitch-username-generator, kit 1.2 tokens) */
.bvk-t-twitch-username-generator{--tug-ok:var(--kzk-ok,#4ade80)}
.bvk-t-twitch-username-generator .tug-vibes{--kzk-tile-min:96px;--kzk-thumb-h:44px}
.bvk-t-twitch-username-generator .tug-fonts,.bvk-t-twitch-username-generator .tug-fxg,.bvk-t-twitch-username-generator .tug-bgg{--kzk-tile-min:92px;--kzk-thumb-h:40px}
.bvk-t-twitch-username-generator .tug-looks{--kzk-tile-min:104px;--kzk-thumb-h:48px}

/* ── keyword strip ── */
.bvk-t-twitch-username-generator .tug-kwrow{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr) auto;gap:10px;align-items:end;margin:2px 0 12px}
.bvk-t-twitch-username-generator .tug-kwrow .kzk-field{margin:0}
.bvk-t-twitch-username-generator .tug-kwbox{position:relative;display:flex}
.bvk-t-twitch-username-generator .tug-kwbox input{flex:1;min-width:0;padding-right:44px}
.bvk-t-twitch-username-generator .tug-dice{position:absolute;right:4px;top:50%;transform:translateY(-50%);width:34px;height:34px}
.bvk-t-twitch-username-generator .tug-gen{min-height:44px;padding-inline:20px;white-space:nowrap}
.bvk-t-twitch-username-generator .tug-kwNote{margin:-4px 0 10px}
.bvk-t-twitch-username-generator .tug-ideas{container:tugi/inline-size}
@container tugi (max-width:640px){
  .bvk-t-twitch-username-generator .tug-kwrow{grid-template-columns:1fr 1fr}
  .bvk-t-twitch-username-generator .tug-kwf{grid-column:1/-1}
  .bvk-t-twitch-username-generator .tug-gen{grid-column:auto}
}
@container tugi (max-width:400px){
  .bvk-t-twitch-username-generator .tug-kwrow{grid-template-columns:1fr}
  .bvk-t-twitch-username-generator .tug-gen{width:100%}
}

/* ── restored-draft chip, lock chip ── */
.bvk-t-twitch-username-generator .tug-draft{display:flex;align-items:center;gap:8px;margin:0 0 10px;padding:7px 10px;border-radius:var(--kzk-r-md);background:var(--kzk-hl-bg);border:1px solid var(--kzk-hl-line);color:var(--kzk-text-2);font-size:12.5px}
.bvk-t-twitch-username-generator .tug-draft[hidden],.bvk-t-twitch-username-generator .tug-lock[hidden]{display:none}
.bvk-t-twitch-username-generator .tug-draft .kzk-i{width:15px;height:15px;color:var(--kzk-lilac);flex:none}
.bvk-t-twitch-username-generator .tug-linkBtn{margin-left:auto;background:none;border:0;padding:2px 4px;color:var(--kzk-lilac);font:600 12.5px/1.2 var(--kzk-font);cursor:pointer;text-decoration:underline;text-underline-offset:2px}
.bvk-t-twitch-username-generator .tug-lock{display:inline-flex;align-items:center;gap:4px;margin:0 0 10px;padding:3px 4px 3px 12px;border-radius:999px;background:var(--kzk-hl-bg);border:1px solid var(--kzk-hl-line);color:var(--kzk-text);font:600 12.5px/1.2 var(--kzk-font)}

/* ── idea grid ── */
.bvk-t-twitch-username-generator .tug-out{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,250px),1fr));gap:8px}
.bvk-t-twitch-username-generator .tug-card{position:relative;display:grid;grid-template-columns:auto minmax(0,1fr) auto;grid-template-rows:auto auto;column-gap:6px;align-items:center;min-width:0;padding:8px 8px 8px 6px;border-radius:var(--kzk-r-md);background:var(--kzk-field);border:1px solid var(--kzk-line-2);transition:border-color .16s,background-color .16s,box-shadow .16s}
.bvk-t-twitch-username-generator .tug-card:hover{border-color:var(--kzk-line-hover,var(--kzk-line-2));background:var(--kzk-card-2)}
html[data-theme=light] .bvk-t-twitch-username-generator .tug-card:hover{background:var(--kzk-card)}
.bvk-t-twitch-username-generator .tug-card.is-pick{border-color:var(--kzk-gold-line);box-shadow:inset 0 0 0 .5px var(--kzk-gold-line);background:var(--kzk-sel-bg,var(--kzk-card-2))}
.bvk-t-twitch-username-generator .tug-heart{grid-row:1/3;display:grid;place-items:center;width:32px;height:32px;border:0;border-radius:50%;background:none;color:var(--kzk-faint);cursor:pointer;transition:color .16s,background-color .16s,transform .16s}
.bvk-t-twitch-username-generator .tug-heart .kzk-i{width:18px;height:18px}
.bvk-t-twitch-username-generator .tug-heart:hover{color:var(--kzk-lilac);background:var(--kzk-hl-bg)}
.bvk-t-twitch-username-generator .tug-heart.on{color:var(--kzk-lilac)}
.bvk-t-twitch-username-generator .tug-heart.on path{fill:currentColor}
@media (prefers-reduced-motion:no-preference){.bvk-t-twitch-username-generator .tug-heart.on{animation:tug-pop .28s var(--kzk-ease)}}
@keyframes tug-pop{40%{transform:scale(1.25)}}
.bvk-t-twitch-username-generator .tug-name{grid-column:2;min-width:0;padding:0;margin:0;border:0;background:none;color:var(--kzk-text);font:700 16.5px/1.25 var(--kzk-font-head,"Space Grotesk",system-ui,sans-serif);text-align:left;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;cursor:pointer;letter-spacing:.005em}
.bvk-t-twitch-username-generator .tug-name:focus-visible{outline:2px solid var(--kzk-gold);outline-offset:2px;border-radius:4px}
.bvk-t-twitch-username-generator .tug-card.is-pick .tug-name{color:var(--kzk-gold)}
.bvk-t-twitch-username-generator .tug-meta{grid-column:2;display:flex;align-items:center;gap:8px;min-width:0;margin-top:3px;font:600 11px/1 var(--kzk-font);color:var(--kzk-muted)}
.bvk-t-twitch-username-generator .tug-warn{padding:2px 6px;border-radius:999px;background:rgba(245,158,11,.14);color:var(--kzk-warn,#f59e0b);font-size:10.5px;cursor:help}
.bvk-t-twitch-username-generator .tug-warn:focus-visible{outline:2px solid var(--kzk-gold);outline-offset:2px}
html[data-theme=light] .bvk-t-twitch-username-generator .tug-warn{color:#92400e}
html[data-theme=light] .bvk-t-twitch-username-generator .tug-short,html[data-theme=light] .bvk-t-twitch-username-generator .tug-px{color:#5b21b6}
.bvk-t-twitch-username-generator .tug-short{padding:2px 6px;border-radius:999px;background:var(--kzk-hl-bg);color:var(--kzk-lilac);font-size:10.5px;letter-spacing:.02em}
.bvk-t-twitch-username-generator .tug-acts{grid-column:3;grid-row:1/3;display:flex;gap:2px}
.bvk-t-twitch-username-generator .tug-acts .kzk-icon-btn{width:30px;height:30px}
.bvk-t-twitch-username-generator .tug-few{margin-top:10px}
.bvk-t-twitch-username-generator .tug-few[hidden]{display:none}
.bvk-t-twitch-username-generator .tug-ideas .kzk-caption{margin-top:12px}

/* ── pattern chips ── */
.bvk-t-twitch-username-generator .tug-pats{display:grid;grid-template-columns:repeat(auto-fill,minmax(128px,1fr));gap:8px}
.bvk-t-twitch-username-generator .tug-pats>button{position:relative;display:flex;flex-direction:column;align-items:flex-start;gap:3px;min-width:0;min-height:52px;padding:8px 10px 8px 30px;border-radius:var(--kzk-r-md);background:var(--kzk-field);border:1px solid var(--kzk-line-2);color:var(--kzk-text-2);text-align:left;cursor:pointer;transition:border-color .16s,background-color .16s,color .16s}
.bvk-t-twitch-username-generator .tug-pats>button::before{content:"";position:absolute;left:10px;top:11px;width:13px;height:13px;border-radius:4px;border:1.5px solid var(--kzk-faint);box-sizing:border-box;transition:background-color .16s,border-color .16s}
.bvk-t-twitch-username-generator .tug-pats>button:hover{border-color:var(--kzk-line-hover,var(--kzk-line-2));color:var(--kzk-text)}
.bvk-t-twitch-username-generator .tug-pats>button.is-on{border-color:var(--kzk-gold-line);background:var(--kzk-sel-bg,var(--kzk-card-2));color:var(--kzk-text)}
.bvk-t-twitch-username-generator .tug-pats>button.is-on::before{border-color:var(--kzk-gold-line);background:var(--kzk-gold-line) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231a1422' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 12.5l4 4 8-8.5'/%3E%3C/svg%3E") center/11px no-repeat}
.bvk-t-twitch-username-generator .tug-pats>button.is-off{opacity:.55}
.bvk-t-twitch-username-generator .tug-pats>button:focus-visible{outline:2px solid var(--kzk-gold);outline-offset:2px}
.bvk-t-twitch-username-generator .tug-pn{font:600 13px/1.2 var(--kzk-font)}
.bvk-t-twitch-username-generator .tug-px{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--kzk-lilac);font:500 11.5px/1.2 var(--kzk-font)}
.bvk-t-twitch-username-generator .tug-numNote{margin-top:8px}
.bvk-t-twitch-username-generator .tug-case small{font-size:10.5px;color:var(--kzk-muted);font-weight:500}
.bvk-t-twitch-username-generator .tug-case>button.on small{color:inherit;opacity:.85}

/* ── palette chips: swatch grid, the name shows as a tooltip and in the section head ── */
.bvk-t-twitch-username-generator .tug-pals{display:grid;grid-template-columns:repeat(auto-fill,minmax(56px,1fr));gap:6px}
.bvk-t-twitch-username-generator .tug-pals>button{display:block;min-width:0;padding:4px;border-radius:var(--kzk-r-md);background:var(--kzk-field);border:1px solid var(--kzk-line-2);cursor:pointer;transition:border-color .16s,box-shadow .16s,transform .16s}
.bvk-t-twitch-username-generator .tug-pals>button span{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.bvk-t-twitch-username-generator .tug-pals>button:hover{border-color:var(--kzk-line-hover,var(--kzk-line-2));transform:translateY(-1px)}
.bvk-t-twitch-username-generator .tug-pals>button.on{border-color:var(--kzk-gold-line);box-shadow:0 0 0 1px var(--kzk-gold-line)}
.bvk-t-twitch-username-generator .tug-pals>button:focus-visible{outline:2px solid var(--kzk-gold);outline-offset:2px}
.bvk-t-twitch-username-generator .tug-sw{display:block;width:100%;height:28px;border-radius:6px;box-shadow:inset 0 0 0 1px rgba(255,255,255,.12),0 0 0 1px rgba(0,0,0,.18)}
.bvk-t-twitch-username-generator .tug-sw--auto{background:conic-gradient(from 210deg,#a855f7,#22d3ee,#a3e635,#fbbf24,#fb7185,#a855f7)}

/* ── your pick ── */
.bvk-t-twitch-username-generator .tug-pick{margin:4px 0 12px}
.bvk-t-twitch-username-generator .tug-exp>.kzk-sec{margin-top:18px;padding-top:16px;border-top:1px solid var(--kzk-line)}
.bvk-t-twitch-username-generator .tug-pickRow{display:flex;align-items:center;gap:12px;margin-bottom:12px}
.bvk-t-twitch-username-generator .tug-pickRow canvas{flex:none;width:56px;height:56px;border-radius:50%;box-shadow:0 0 0 1px var(--kzk-line-2)}
.bvk-t-twitch-username-generator .tug-pickName{min-width:0;font:700 22px/1.2 var(--kzk-font-head,"Space Grotesk",system-ui,sans-serif);color:var(--kzk-text);overflow-wrap:anywhere}
.bvk-t-twitch-username-generator .tug-morePick{margin-top:10px}
.bvk-t-twitch-username-generator .tug-fit{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:6px}
.bvk-t-twitch-username-generator .tug-fit li{display:inline-flex;align-items:center;gap:6px;padding:4px 10px 4px 8px;border-radius:999px;border:1px solid var(--kzk-line-2);background:var(--kzk-field);font:600 12px/1.3 var(--kzk-font);color:var(--kzk-text)}
.bvk-t-twitch-username-generator .tug-fit li.ok{border-color:rgba(74,222,128,.4)}
.bvk-t-twitch-username-generator .tug-fit li.no{flex-basis:100%;border-color:rgba(245,158,11,.5);border-radius:var(--kzk-r-md)}
.bvk-t-twitch-username-generator .tug-fitDot{flex:none;width:8px;height:8px;border-radius:50%;background:var(--tug-ok)}
.bvk-t-twitch-username-generator .tug-fit li.no .tug-fitDot{background:var(--kzk-warn,#f59e0b)}
.bvk-t-twitch-username-generator .tug-fitW{font-weight:500;color:var(--kzk-warn,#f59e0b)}
html[data-theme=light] .bvk-t-twitch-username-generator .tug-fitW{color:#92400e}
.bvk-t-twitch-username-generator .tug-check{display:grid;gap:6px;margin-top:4px}
.bvk-t-twitch-username-generator .tug-links{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}
.bvk-t-twitch-username-generator .tug-links .kzk-btn{min-height:36px}
.bvk-t-twitch-username-generator .tug-check .kzk-hint{font-size:11.5px}
.bvk-t-twitch-username-generator .tug-links .kzk-btn{justify-content:center;min-width:0;padding-inline:6px;text-decoration:none}

/* ── shortlist ── */
.bvk-t-twitch-username-generator .tug-sl{list-style:none;margin:0;padding:0;display:grid;gap:4px;max-height:260px;overflow:auto}
.bvk-t-twitch-username-generator .tug-sl:empty{display:none}
.bvk-t-twitch-username-generator .tug-sl li{display:flex;align-items:center;gap:2px;padding:3px 3px 3px 10px;border-radius:var(--kzk-r-sm);background:var(--kzk-field);border:1px solid var(--kzk-line)}
.bvk-t-twitch-username-generator .tug-sl li.is-pick{border-color:var(--kzk-gold-line)}
.bvk-t-twitch-username-generator .tug-slName{flex:1;min-width:0;padding:4px 0;border:0;background:none;color:var(--kzk-text);font:600 13.5px/1.2 var(--kzk-font);text-align:left;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;cursor:pointer}
.bvk-t-twitch-username-generator .tug-sl .kzk-icon-btn{width:28px;height:28px}
.bvk-t-twitch-username-generator .tug-slAct{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,150px),1fr));gap:6px;margin-top:8px}
.bvk-t-twitch-username-generator .tug-slEmpty[hidden]{display:none}
.bvk-t-twitch-username-generator #tug-slClear[hidden]{display:none}
.bvk-t-twitch-username-generator .tug-dlPng{width:100%;margin-top:10px}
.bvk-t-twitch-username-generator .tug-exp .kzk-sec-head .kzk-icon-btn{margin-left:auto}

/* ── brand preview ── */
.bvk-t-twitch-username-generator .tug-brand{margin:0 0 14px}
.bvk-t-twitch-username-generator .tug-stagehead{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:8px}
.bvk-t-twitch-username-generator .tug-view{margin-right:auto}
.bvk-t-twitch-username-generator .tug-view>button{min-height:30px;padding-inline:12px}
.bvk-t-twitch-username-generator .tug-brand .kzk-stage canvas{border-radius:6px}
.bvk-t-twitch-username-generator .tug-brand .kzk-caption{margin-top:8px}
.bvk-t-twitch-username-generator .tug-surprise{margin-left:auto}
.bvk-t-twitch-username-generator .tug-kw2f .kzk-label{color:var(--kzk-muted)}
.bvk-t-twitch-username-generator .tug-dice:hover{color:var(--kzk-lilac)}
.bvk-t-twitch-username-generator .tug-deco{max-width:100%}
.bvk-t-twitch-username-generator .tug-showMore{display:none;width:100%;margin-top:8px;justify-content:center}

/* ── phone ── */
@container tugi (max-width:420px){
  .bvk-t-twitch-username-generator .tug-out:not(.is-all) .tug-card:nth-child(n+7){display:none}
  .bvk-t-twitch-username-generator .tug-showMore:not([hidden]){display:flex}
  .bvk-t-twitch-username-generator .tug-more{display:none}
}
@container kzk (max-width:440px){
  .bvk-t-twitch-username-generator .tug-acts .kzk-icon-btn,.bvk-t-twitch-username-generator .tug-heart{width:40px;height:40px}
  .bvk-t-twitch-username-generator .tug-name{font-size:17px}
  .bvk-t-twitch-username-generator .tug-pats{grid-template-columns:1fr 1fr}
}
/* Wide brand images (2.5:1, 3:1) would float in the kit's 240px stage on narrow screens */
.bvk-t-twitch-username-generator .tug-brand .kzk-stage{min-height:0}
@container kzk (max-width:600px){.bvk-t-twitch-username-generator .tug-brand{--kzk-stage-pad:12px}}
