/* Sohbetteki minioyun kartları */
.mg-card { margin: 8px 6px; padding: 12px 14px; border-radius: 14px; border: 1px solid var(--line, rgba(127,127,127,.28)); background: var(--panel, rgba(127,127,127,.08)); display: grid; gap: 8px; animation: mg-in .35s cubic-bezier(.2, .9, .3, 1.2); }
.mg-card.live { border-color: var(--accent, #6366f1); box-shadow: 0 0 0 1px color-mix(in srgb, var(--accent, #6366f1) 35%, transparent), 0 6px 22px color-mix(in srgb, var(--accent, #6366f1) 14%, transparent); }
.mg-card.done { opacity: .82; }
.mg-head { display: flex; align-items: center; gap: 8px; font-size: 12px; }
.mg-badge { font-weight: 700; letter-spacing: .02em; }
.mg-live { padding: 1px 7px; border-radius: 99px; background: #ef4444; color: #fff; font-size: 10px; font-weight: 700; animation: mg-pulse 1.2s ease-in-out infinite; }
.mg-end { padding: 1px 7px; border-radius: 99px; background: rgba(127,127,127,.25); font-size: 10px; font-weight: 700; }
.mg-timer { margin-left: auto; font-variant-numeric: tabular-nums; font-weight: 700; opacity: .85; }
.mg-prompt { text-align: center; font-size: 38px; line-height: 1.25; letter-spacing: 6px; font-weight: 700; word-break: break-word; }
.mg-done .mg-prompt, .mg-card.done .mg-prompt { font-size: 28px; opacity: .7; }
.mg-prompt.mg-text { font-size: 20px; letter-spacing: 0; line-height: 1.35; font-weight: 700; }
.mg-sub { text-align: center; font-size: 12px; opacity: .8; }
.mg-hint { text-align: center; font-size: 13px; }
.mg-hint code { letter-spacing: 2px; font-size: 14px; background: rgba(127,127,127,.18); padding: 2px 8px; border-radius: 6px; }
.mg-bar { height: 6px; border-radius: 99px; background: rgba(127,127,127,.2); overflow: hidden; }
.mg-bar > i { display: block; height: 100%; background: var(--accent, #6366f1); transition: width .5s linear; }
.mg-result { text-align: center; font-size: 13px; }
.mg-actions { display: flex; justify-content: center; }
.mg-act { min-width: 160px; padding: 12px 22px; border-radius: 12px; border: 0; font-size: 18px; font-weight: 800; letter-spacing: .06em; cursor: pointer; color: #fff; background: var(--accent, #6366f1); transition: transform .08s, filter .15s; }
.mg-act:active { transform: scale(.96); }
.mg-act:disabled { filter: grayscale(.7) brightness(.8); cursor: default; }
.mg-act.bas { background: #475569; }
.mg-reflex.go { border-color: #22c55e; box-shadow: 0 0 0 2px rgba(34, 197, 94, .45), 0 0 26px rgba(34, 197, 94, .3); }
.mg-reflex.go .mg-prompt { color: #22c55e; font-size: 46px; animation: mg-pop .25s ease-out; }
.mg-reflex.go .mg-act.bas { background: #16a34a; }
.mg-reflex.wait .mg-prompt { opacity: .7; font-size: 30px; }
.mg-hp { position: relative; height: 22px; border-radius: 99px; background: rgba(127,127,127,.22); overflow: hidden; }
.mg-hp > i { position: absolute; inset: 0 auto 0 0; background: linear-gradient(90deg, #ef4444, #f97316); transition: width .25s ease-out; }
.mg-hp > span { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; font-size: 12px; font-weight: 700; color: #fff; text-shadow: 0 1px 2px rgba(0, 0, 0, .55); }
.mg-top3 { display: flex; justify-content: center; flex-wrap: wrap; gap: 4px 14px; font-size: 12px; }
.mg-bidline { text-align: center; font-size: 14px; } .mg-bidline small { opacity: .7; display: block; margin-top: 2px; }
.mg-bidform { display: flex; gap: 6px; justify-content: center; align-items: stretch; }
.mg-bidform .mg-act { min-width: 0; flex: 1; padding: 8px 14px; font-size: 15px; letter-spacing: 0; }
.mg-amount { width: 96px; min-width: 0; flex: none; padding: 8px 10px; border-radius: 10px; border: 1px solid var(--line, rgba(127,127,127,.4)); background: var(--surface, transparent); color: inherit; font-weight: 700; font-size: 1rem; text-align: center; }
.mg-act.sm { min-width: 0; padding: 8px 14px; font-size: 14px; letter-spacing: 0; }
.mg-actions { gap: 6px; flex-wrap: wrap; }
.mg-up { color: #16a34a; } .mg-down { color: #dc2626; }
.mg-auction.live .mg-prompt { font-size: 44px; letter-spacing: 0; }
.mg-mafia .mg-prompt { font-size: 40px; letter-spacing: 0; }
.mg-mafia.ph-night { background: linear-gradient(180deg, rgba(30, 27, 75, .55), rgba(15, 23, 42, .35)); }
.mg-mafia.ph-day { background: linear-gradient(180deg, rgba(250, 204, 21, .12), transparent); }
.mg-people, .mg-dead { text-align: center; font-size: 13px; } .mg-dead { opacity: .75; }
.mg-private { border: 1px dashed var(--accent, #6366f1); border-radius: 12px; padding: 10px; display: grid; gap: 8px; background: color-mix(in srgb, var(--accent, #6366f1) 10%, transparent); }
.mg-role { display: grid; gap: 2px; text-align: center; font-size: 13px; } .mg-role b { font-size: 15px; }
.mg-info { text-align: center; font-weight: 700; font-size: 13px; }
.mg-opts { display: flex; flex-wrap: wrap; gap: 6px; justify-content: center; }
.mg-opt { padding: 8px 12px; border-radius: 10px; border: 1px solid var(--line, rgba(127,127,127,.4)); background: var(--surface, transparent); color: inherit; font-weight: 700; cursor: pointer; }
.mg-opt:hover { border-color: var(--accent, #6366f1); }
.mg-score { display: flex; justify-content: center; align-items: center; gap: 14px; font-size: 22px; font-weight: 800; } .mg-score b { font-size: 14px; opacity: .7; }
.mg-score .red, .mg-teams .red b { color: #ef4444; } .mg-score .blue, .mg-teams .blue b { color: #3b82f6; }
.mg-teams { display: grid; gap: 2px; font-size: 12.5px; text-align: center; }
.mg-team.live .mg-prompt { font-size: 36px; }
@keyframes mg-in { from { opacity: 0; transform: translateY(8px) scale(.97); } to { opacity: 1; transform: none; } }
@keyframes mg-pop { from { transform: scale(.6); } to { transform: scale(1); } }
@keyframes mg-pulse { 50% { opacity: .55; } }
@media (max-width: 520px) { .mg-prompt { font-size: 30px; letter-spacing: 3px; } .mg-act { width: 100%; } }
@media (prefers-reduced-motion: reduce) { .mg-card, .mg-live, .mg-reflex.go .mg-prompt { animation: none; } }

/* Çarkıfelek */
.mg-wheel.live .mg-head .mg-badge { color: #d97706; }
.cfw-chips { display: flex; justify-content: center; gap: 6px; font-size: 12px; font-weight: 700; flex-wrap: wrap; }
.cfw-chips span { padding: 2px 10px; border-radius: 99px; background: rgba(127,127,127,.2); }
.cfw-chips .cat { background: color-mix(in srgb, var(--accent, #6366f1) 22%, transparent); }
.cfw-chips .x2 { background: #ef9f27; color: #412402; }
.cfw-box { position: relative; width: min(100%, 250px); margin: 4px auto 0; padding-top: 12px; }
.cfw-svg svg { display: block; width: 100%; height: auto; }
.cfw-ptr { position: absolute; left: 50%; top: 0; width: 24px; height: 31px; margin-left: -12px; z-index: 3; transform-origin: 50% 10%; }
.cfw-ptr svg { display: block; width: 100%; height: 100%; }
.cfw-ptr.sp { animation: cfw-tick .14s linear infinite; }
.cfw-svg .cfa { animation: cfw-blink 1s steps(1) infinite; } .cfw-svg .cfb { animation: cfw-blink 1s steps(1) infinite reverse; }
.cfw-status { text-align: center; font-size: 13px; font-weight: 700; min-height: 18px; opacity: .85; }
.cfw-status.mine { color: #d97706; opacity: 1; }
.cfw-tiles { display: flex; flex-wrap: wrap; justify-content: center; gap: 4px 12px; }
.cfw-word { display: flex; gap: 3px; }
.cfw-t { width: 24px; height: 30px; border-radius: 5px; display: flex; align-items: center; justify-content: center; font-size: 15px; font-weight: 800; background: rgba(127,127,127,.14); border: 1px solid rgba(127,127,127,.3); }
.cfw-t.on { background: color-mix(in srgb, var(--accent, #6366f1) 22%, transparent); border-color: var(--accent, #6366f1); }
.cfw-t.new { background: #16a34a; border-color: #16a34a; color: #fff; animation: mg-pop .3s ease-out; }
.cfw-scores { display: flex; gap: 6px; flex-wrap: wrap; justify-content: center; }
.cfw-p { min-width: 70px; padding: 4px 10px; border-radius: 10px; border: 1px solid rgba(127,127,127,.3); text-align: center; display: grid; line-height: 1.25; }
.cfw-p small { font-size: 11px; opacity: .75; } .cfw-p b { font-size: 15px; } .cfw-p i { font-style: normal; font-size: 11px; color: #16a34a; }
.cfw-p.on { border: 2px solid var(--accent, #6366f1); } .cfw-p.me small { font-weight: 800; opacity: 1; } .cfw-p.out { opacity: .4; }
.cfw-keys { display: flex; flex-wrap: wrap; justify-content: center; gap: 4px; }
.cfw-k { width: 28px; height: 30px; padding: 0; border-radius: 7px; border: 1px solid var(--line, rgba(127,127,127,.4)); background: var(--surface, transparent); color: inherit; font-weight: 700; font-size: 13px; cursor: pointer; }
.cfw-k.v { border-color: #ef9f27; }
.cfw-k:disabled { opacity: .3; cursor: default; } .cfw-k.u { text-decoration: line-through; }
.cfw-k:not(:disabled):hover { border-color: var(--accent, #6366f1); }
.cfw-form { display: flex; gap: 6px; } .cfw-solve { flex: 1; min-width: 0; padding: 8px 10px; border-radius: 10px; border: 1px solid var(--line, rgba(127,127,127,.4)); background: var(--surface, transparent); color: inherit; font-size: 14px; }
.cfw-err { min-height: 14px; font-size: 12px; color: #dc2626; text-align: center; }
.mg-act.wheel { background: #d97706; }
@keyframes cfw-tick { 0%, 100% { transform: rotate(0); } 50% { transform: rotate(-14deg); } }
@keyframes cfw-blink { 50% { opacity: .25; } }
@media (prefers-reduced-motion: reduce) { .cfw-ptr.sp, .cfw-svg .cfa, .cfw-svg .cfb { animation: none; } }
.mg-card.mg-wheel { animation: none; }

/* Balon Avı / Kelime Yağmuru */
.rn-goal { position: relative; height: 22px; border-radius: 99px; background: rgba(127,127,127,.22); overflow: hidden; }
.rn-goal > i { position: absolute; inset: 0 auto 0 0; background: linear-gradient(90deg, #6366f1, #22c55e); transition: width .25s ease-out; }
.rn-goal.hit > i { background: #16a34a; }
.rn-goal > span { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; font-size: 12px; font-weight: 800; color: #fff; text-shadow: 0 1px 2px rgba(0,0,0,.55); }
.rn-stage { position: relative; height: 210px; overflow: hidden; border-radius: 12px; border: 1px solid rgba(127,127,127,.3); touch-action: manipulation; user-select: none; }
.rn-stage.balloon { background: linear-gradient(180deg, #7dd3fc, #e0f2fe); }
.rn-stage.word { background: linear-gradient(180deg, #1e1b4b, #312e81); }
.rn-wait { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; font-weight: 800; color: rgba(255,255,255,.8); }
.rn-b { position: absolute; bottom: -56px; width: 46px; height: 56px; margin-left: -23px; padding: 0; border: 0; border-radius: 50% 50% 48% 48%; background: hsl(var(--h, 200) 80% 55%); color: #fff; font-size: 17px; font-weight: 800; cursor: pointer; display: grid; place-items: center; animation-name: rn-rise; animation-timing-function: linear; animation-fill-mode: forwards; text-shadow: 0 1px 2px rgba(0,0,0,.4); }
.rn-b::after { content: ''; position: absolute; left: 50%; top: 100%; width: 1px; height: 14px; background: rgba(0,0,0,.35); }
.rn-b small { position: absolute; top: -8px; right: -6px; font-size: 14px; }
.rn-b.gold { background: #f59e0b; box-shadow: 0 0 14px #fbbf24; }
.rn-b.bomb { background: #1f2937; font-size: 22px; }
.rn-b.rainbow { background: conic-gradient(#ef4444, #f59e0b, #facc15, #22c55e, #3b82f6, #a855f7, #ef4444); }
.rn-b.gone { transform: scale(1.6) !important; opacity: 0 !important; transition: transform .15s, opacity .15s; pointer-events: none; }
.rn-w { position: absolute; top: -34px; transform: translateX(-50%); padding: 4px 12px; border-radius: 99px; background: rgba(255,255,255,.92); color: #1e1b4b; font-weight: 800; font-size: 16px; white-space: nowrap; animation-name: rn-fall; animation-timing-function: linear; animation-fill-mode: forwards; }
.rn-w.gold { background: #fbbf24; } .rn-w.bomb { background: #ef4444; color: #fff; }
.rn-w i { font-style: normal; margin-right: 4px; }
.rn-form { display: flex; } .rn-in { flex: 1; min-width: 0; padding: 9px 12px; border-radius: 10px; border: 1px solid var(--line, rgba(127,127,127,.4)); background: var(--surface, transparent); color: inherit; font-size: 15px; }
@keyframes rn-rise { from { transform: translateY(0); visibility: visible; } 99% { visibility: visible; } to { transform: translateY(-290px); visibility: hidden; } }
@keyframes rn-fall { from { top: -34px; visibility: visible; } 99% { visibility: visible; } to { top: 214px; visibility: hidden; } }
@media (prefers-reduced-motion: reduce) { .rn-b, .rn-w { animation-duration: 1ms !important; } }

.mg-card.mg-balloon, .mg-card.mg-rain { animation: none; }

.rn-powers { display: flex; gap: 6px; justify-content: center; flex-wrap: wrap; }
.rn-pw { padding: 6px 12px; border-radius: 10px; border: 1px solid var(--line, rgba(127,127,127,.4)); background: var(--surface, transparent); color: inherit; font-weight: 700; font-size: 12.5px; cursor: pointer; }
.rn-pw:disabled { opacity: .55; cursor: default; border-color: #16a34a; }
.rn-pw:not(:disabled):hover { border-color: var(--accent, #6366f1); }
