/* Rozdání Plísně (core/stash-grant.js, spec docs/superpowers/specs/2026-10-27-rozdani-plisne-design.md, maketa 1:1
   artifact ExM4FD83FJsUneouhJYNTi). Barva patří akci rozdání: --g1 / --g2 / --gs (zastávky) / --gst (zastávky textu)
   na kartě / QR řádku / pruhu (applyGrantColors, grantColorStyle); bez nich výchozí zelená Plísně. Žádné efekty barvy. */
.ucg-msg, .ucg, .uc-qd-grant, .ucb-nt.ucg-two {
  --g1: #b6f59a; --g2: #2f8a3c; --gs: #b6f59a, #2f8a3c;
  --gc1: var(--g1); --gc2: var(--g2); --gcs: var(--gs);
}
.ucg { --gc1: var(--g1); --gc2: var(--g2); --gcs: var(--gs); }

/* ===== Karta v chatu (varianta C „Déšť Plísně“) ===== */
.msg.ucg-msg { padding: 4px 6px; background: none; border: 0; }
.msg.ucg-msg:hover { background: none; }
.msg.ucg-msg.ucg-away { display: none; }   /* sloučená do karty nejnovějšího rozdání (syncGrantMerge) */
.ucg { position: relative; overflow: hidden; border-radius: 12px; padding: 13px 12px 0; text-align: center;
  /* Rámeček přechodem akce (jako okraj karty odznaku, badge-v3-card.js metal 135°), uvnitř nádech + karta. */
  background: radial-gradient(120% 90% at 50% 0%, color-mix(in srgb, var(--gc1) 20%, transparent), rgba(14, 14, 16, 0) 70%) padding-box, linear-gradient(#121214, #121214) padding-box, linear-gradient(135deg, var(--gcs)) border-box;
  border: 1.5px solid transparent; }
.ucg.no-late { padding-bottom: 1px; }
.ucg-rain { position: absolute; inset: 0; pointer-events: none; }
.ucg-drop { position: absolute; top: -28px; opacity: 0; line-height: 0; }
.ucg.play .ucg-drop { animation: ucg-drop 1.6s cubic-bezier(.3, .6, .4, 1) var(--d) both; }
@keyframes ucg-drop { 0% { transform: translateY(0) rotate(0); opacity: 0; } 15% { opacity: 1; } 80% { opacity: .9; } 100% { transform: translateY(160px) rotate(var(--r)); opacity: 0; } }
.ucg.play { animation: ucg-in .45s cubic-bezier(.2, 1, .3, 1) both; }
@keyframes ucg-in { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }
.ucg-k { position: relative; font-size: 10.5px; letter-spacing: .08em; text-transform: uppercase; font-weight: 700; color: var(--text-muted, #a3a3ae); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ucg-amt { position: relative; display: inline-flex; align-items: center; gap: 6px; margin: 4px 0 2px; font-size: 38px; font-weight: 800; line-height: 1.05;
  background: linear-gradient(180deg, var(--gst, var(--gs))); -webkit-background-clip: text; background-clip: text; color: transparent; font-variant-numeric: tabular-nums; white-space: nowrap; }
.ucg-amt .uc-stash-ico { width: 34px; height: 34px; object-fit: contain; }
.ucg.play .ucg-amt { animation: ucg-pop .5s .2s cubic-bezier(.2, 1.4, .4, 1) both; }
@keyframes ucg-pop { from { transform: scale(.6); opacity: 0; } to { transform: none; opacity: 1; } }
.ucg-sub { position: relative; font-size: 13px; font-weight: 600; color: var(--text-primary, #efeff1); }
.ucg-sub small { display: block; margin-top: 2px; font-size: 12px; font-weight: 400; color: var(--text-muted, #a3a3ae); }
.ucg-names { position: relative; display: flex; flex-wrap: wrap; gap: 4px; justify-content: center; align-items: center; margin: 9px 0 12px; }
.ucg-names:empty { margin: 6px 0; }
.ucg-names.one { flex-wrap: nowrap; overflow: hidden; }
.ucg-chip { box-sizing: border-box; display: inline-flex; align-items: center; height: 22px; padding: 0 9px; border-radius: 11px; flex: none; white-space: nowrap;
  background: rgba(255, 255, 255, .06); border: 1px solid transparent; font: 600 12px/1 Inter, "Segoe UI", sans-serif; color: var(--text-primary, #efeff1); }
.ucg-chip.nouc { color: var(--text-muted, #a3a3ae); font-weight: 500; }
.ucg-chip.me { background: rgba(255, 140, 0, .18); border-color: rgba(255, 140, 0, .6); }
.ucg-chip.late { border: 1px dashed color-mix(in srgb, var(--gc1) 55%, transparent); }
.ucg-chip.new { animation: ucg-chip .6s cubic-bezier(.2, 1.4, .4, 1) both; }
@keyframes ucg-chip { from { transform: scale(.4); opacity: 0; } to { transform: none; opacity: 1; } }
button.ucg-more { cursor: pointer; background: transparent; border: 1px solid rgba(255, 255, 255, .16); color: var(--text-muted, #a3a3ae); font-weight: 500; }
button.ucg-more:hover { color: var(--text-primary, #efeff1); border-color: rgba(255, 255, 255, .3); }
button.ucg-more:focus-visible { outline: 2px solid #ff8c00; outline-offset: 1px; }
.ucg-late-slot { display: block; }
.ucg-late { position: relative; margin: 0 -12px; padding: 8px 12px 9px; display: flex; align-items: center; gap: 8px; text-align: left;
  border-top: 1px solid color-mix(in srgb, var(--gc1) 22%, transparent); background: color-mix(in srgb, var(--gc1) 8%, transparent); font-size: 12.5px; line-height: 1.35; color: var(--text-primary, #efeff1); }
.ucg-late b { color: var(--g1); }
.ucg-nb { white-space: nowrap; }   /* „taky +N {ikona}“ nikdy neroztrhnout */
.ucg-lico { width: 22px; height: 22px; object-fit: contain; vertical-align: -6px; margin: -4px 0 -4px 3px; }
.ucg-ltxt { min-width: 0; }
.ucg-ltxt small { display: block; font-size: 11.5px; color: var(--text-muted, #a3a3ae); }
.ucg-tm { margin-left: auto; flex: none; font-size: 16px; font-weight: 800; color: #ffd93d; font-variant-numeric: tabular-nums; }
.ucg-tm.hot { color: #ff7a59; }
.ucg-bar { position: absolute; left: 0; bottom: 0; height: 2px; width: var(--p, 100%); background: linear-gradient(90deg, var(--gcs)); transition: width 1s linear; }
.ucg-dot { width: 8px; height: 8px; border-radius: 50%; flex: none; background: var(--gc1); animation: ucg-pulse 1.8s infinite; }
@keyframes ucg-pulse { 0% { box-shadow: 0 0 0 0 color-mix(in srgb, var(--gc1) 55%, transparent); } 70% { box-shadow: 0 0 0 7px color-mix(in srgb, var(--gc1) 0%, transparent); } 100% { box-shadow: 0 0 0 0 color-mix(in srgb, var(--gc1) 0%, transparent); } }
.ucg-late.paused { background: rgba(255, 200, 0, .06); border-top-color: rgba(255, 200, 0, .22); }
.ucg-late.paused .ucg-tm { color: var(--text-muted, #a3a3ae); }
.ucg-late.paused .ucg-bar { background: rgba(255, 255, 255, .25); transition: none; }
.ucg-pz { width: 10px; height: 10px; flex: none; background: linear-gradient(90deg, #ffc800 0 35%, transparent 35% 65%, #ffc800 65%); }
.ucg-late.closed { background: rgba(255, 255, 255, .03); border-top-color: rgba(255, 255, 255, .08); color: var(--text-muted, #a3a3ae); }
.ucg-late.closed b { color: var(--text-primary, #efeff1); }
.ucg-late.closed .ucg-dot { background: #5d5d66; animation: none; }

/* Náhled /zl tempbonus v nápovědě commandu: skutečné karty, bez rámečku náhledu. */
.uc-cmdh-prev-grantcard { display: flex; flex-direction: column; gap: 6px; padding: 0; min-height: 0; border: none; background: none; }
.uc-cmdh-prev-grantcard > .msg.ucg-msg { padding: 0; }

/* ===== QR dono: řádek rozdání pod boxem bonusu (stejná stavba jako .uc-qd-bonus, barva akce) ===== */
.uc-qd-grant .uc-qd-bonus-in { background: color-mix(in srgb, var(--gc1) 8%, transparent); border-color: color-mix(in srgb, var(--gc1) 38%, transparent); }
.uc-qd-grant .uc-qd-bonus-n { background: linear-gradient(180deg, var(--gst, var(--gs))); -webkit-background-clip: text; background-clip: text; color: transparent; }
.uc-qd-grant.ucg-stack .uc-qd-bonus-txt { order: -1; flex: 0 1 auto; margin-right: 2px; }
.uc-qd-grant .uc-qd-bonus-t { display: flex; align-items: center; gap: 0 4px; flex-wrap: nowrap; min-width: 0; flex: 1 1 auto; }
.uc-qd-grant .uc-qd-bonus-t > .uc-qd-bonus-n, .uc-qd-grant .uc-qd-bonus-t > .uc-qd-bonus-ico { flex: none; margin: 0; }
.uc-qd-grant .uc-qd-bonus-txt { display: block; flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: clip; white-space: nowrap; }
.uc-qd-grant .ucg-mq-in { background: none; color: inherit; -webkit-text-fill-color: currentColor; }
.uc-qd-grant .uc-qd-bonus-side:empty { display: none; }
.uc-qd-grant .uc-qd-bonus-side { flex: none; font-size: 14px; font-weight: 800; color: #ffd93d; font-variant-numeric: tabular-nums; }
/* Rozpis rozdání v tooltipu: položky na jednom řádku, číslo v barvě akce. */
.uc-tooltip .uc-tip-bl b.ucg-tip-n { -webkit-background-clip: text; background-clip: text; color: transparent; }
.uc-tooltip.ucg-tip { max-width: none; white-space: nowrap; }
.uc-tooltip.ucg-tip .uc-tip-bl span { white-space: nowrap; }

/* ===== Posun tam a zpět (QR řádek, pruh Rozumím) místo trojteček ===== */
.ucg-mq { overflow: hidden; }
.ucg-mq-in { display: inline-block; white-space: nowrap; will-change: transform; }
.ucg-mq.run .ucg-mq-in { animation: ucg-mq var(--mq-t, 8s) ease-in-out infinite; }
@keyframes ucg-mq { 0%, 6% { transform: translateX(0); } 44%, 52% { transform: translateX(var(--mq-d)); } 92%, 100% { transform: translateX(0); } }

/* ===== Pruh „Rozumím“: dva řádky u rozdání, posun u dlouhého textu, ikona 26 px ===== */
.ucb-nt .ucb-nt-text.ucg-mq, .ucb-nt.ucg-two .ucb-nt-text { text-overflow: clip; background: none; color: inherit; animation: none; }
/* Text v gradientu (jako .ucb-nt-text) nese až vnitřní řádek — posouvaný potomek by z ořezu pozadí rodiče vypadl. */
.ucb-nt .ucg-mq-in, .ucg-nt-top { color: transparent; -webkit-background-clip: text; background-clip: text; background-image: linear-gradient(90deg, #ff8c00, #ffd93d); }
.ucg-nt-sub .ucg-mq-in { background-image: linear-gradient(90deg, #ffcf8a, #ffe9a8); }
.ucb-nt.ucg-two .ucb-nt-ico { display: none; }
.ucb-nt.ucg-two .ucb-nt-text { display: flex; flex-direction: column; line-height: 1.25; white-space: normal; }
.ucg-nt-top { -webkit-text-fill-color: transparent; background-image: linear-gradient(90deg, var(--gst, var(--gs))); }
.ucg-nt-top .uc-stash-ico { -webkit-text-fill-color: initial; }
.ucb-nt .ucb-nt-ico { width: 26px; height: 26px; margin: -3px 0; }
.ucb-nt .ucb-nt-ico > img, .ucb-nt .ucb-nt-ico > video { width: 26px; height: 26px; }
.ucg-nt-top { display: inline-flex; align-items: center; gap: 5px; font-size: 15px; font-weight: 800; white-space: nowrap; }
.ucg-nt-top .uc-stash-ico { width: 28px; height: 28px; object-fit: contain; margin: -4px 0; }
.ucg-nt-sub { display: block; overflow: hidden; white-space: nowrap; font-size: 11.5px; font-weight: 600; opacity: .8; letter-spacing: .02em; }

@media (prefers-reduced-motion: reduce) {
  .ucg.play, .ucg.play .ucg-drop, .ucg.play .ucg-amt, .ucg-dot, .ucg-chip.new { animation: none; }
  .ucg-mq .ucg-mq-in { animation: none !important; white-space: normal; }
  .ucb-nt .ucb-nt-text.ucg-mq, .ucg-nt-sub { white-space: normal; }
}
