/* =====================================================================
   BBL — TAKTİK TAHTASI (2026-10-16 TT-1) · bbl-tactic-board.js
   Kutu (#ticker-bist100-tip) artık yalnız taşıyıcı: görünüm tamamen .tt kartında.
   PC: 300 px tasarım 1,3 kat (sağ üst köşeden) · Mobil: 300 px, dar ekranda ekrana sığar.
   ===================================================================== */
#ticker-bist100-tip { background: transparent !important; border: 0 !important; padding: 0 !important; box-shadow: none !important; min-width: 0 !important; }
html:not(.mobile-device) #ticker-bist100-tip { width: max-content !important; max-width: none !important; max-height: calc((100vh - 90px) / 1.3); overflow-y: auto; overscroll-behavior: contain; transform: scale(1.3); transform-origin: top right; margin-top: 6px !important; }
/* [2026-10-24] telefonda kaydırma yok: tahta ekrana sığacak kadar küçülür (bbl-tactic-board.js fit, --tt-z 0,7–1,3) */
html.mobile-device #ticker-bist100-tip { max-height: none !important; overflow: visible !important; max-width: calc(100vw - 16px) !important; border-radius: 14px; }
/* [2026-10-23] mobilde 300 px tasarım ekran genişliğine büyür (≈1,25×; en çok 1,3×). --tt-z bbl-tactic-board.js yazar */
html.mobile-device #ticker-bist100-tip .tt { zoom: var(--tt-z, 1); }

.tt { width: 300px; box-sizing: border-box; font-family: DM Sans, system-ui, -apple-system, 'Segoe UI', sans-serif; color: #e2e8f0; text-align: left;
  background: radial-gradient(120% 70% at 50% -10%, rgba(59,130,246,.18), transparent 60%), linear-gradient(180deg, #0e1a33, #0a1224);
  border: 1px solid rgba(96,165,250,.28); border-radius: 14px; overflow: hidden; box-shadow: 0 14px 40px rgba(0,0,0,.6); }
.tt * { box-sizing: border-box; }
html.mobile-device .tt { width: min(300px, calc(100vw - 16px)); max-width: 100%; }

/* başlık */
.tt-hd { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 9px 12px 7px; border-bottom: 1px solid rgba(148,163,184,.12);
  background: repeating-linear-gradient(90deg, rgba(255,255,255,.02) 0 18px, transparent 18px 36px); }
.tt-t { font-weight: 900; letter-spacing: 2px; font-size: 11px; color: #93c5fd; white-space: nowrap; }
.tt-t b { color: #fbbf24; }
.tt-s { font-size: 9px; font-weight: 800; letter-spacing: .4px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.tt-s.live { color: #f87171; }
.tt-s.live i { display: inline-block; width: 6px; height: 6px; border-radius: 50%; background: #ef4444; margin-right: 4px; box-shadow: 0 0 6px #ef4444; vertical-align: 1px; animation: ttPulse 1.6s ease-in-out infinite; }
.tt-s.pre { color: #c4b5fd; } .tt-s.ok { color: #4ade80; } .tt-s.off { color: #a3afc1; }
@keyframes ttPulse { 50% { opacity: .35; } }

/* bugün */
.tt-today { display: flex; gap: 10px; align-items: center; padding: 11px 12px 6px; }
.tt-badge { flex: 0 0 64px; height: 70px; border-radius: 12px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 1px; }
.tt-badge .k { font-size: 7.5px; font-weight: 800; letter-spacing: 1px; opacity: .7; }
.tt-badge .ic { font-size: 24px; line-height: 1.1; }
.tt-badge .nm { font-size: 9.5px; font-weight: 900; letter-spacing: 1.2px; }
.tt-badge.atk { background: linear-gradient(160deg, rgba(245,158,11,.3), rgba(245,158,11,.06)); border: 1.5px solid rgba(245,158,11,.6); color: #fcd34d; box-shadow: inset 0 0 14px rgba(245,158,11,.15); }
.tt-badge.def { background: linear-gradient(160deg, rgba(59,130,246,.32), rgba(59,130,246,.06)); border: 1.5px solid rgba(96,165,250,.65); color: #bfdbfe; box-shadow: inset 0 0 14px rgba(59,130,246,.18); }
.tt-badge.den { background: linear-gradient(160deg, rgba(148,163,184,.24), rgba(148,163,184,.05)); border: 1.5px solid rgba(148,163,184,.5); color: #e2e8f0; }
.tt-info { flex: 1; min-width: 0; }
.tt-k { font-size: 9px; color: #a3afc1; font-weight: 700; letter-spacing: 1px; }
.tt-big { font-size: 22px; font-weight: 900; font-variant-numeric: tabular-nums; line-height: 1.15; white-space: nowrap; }
.tt-big small { font-size: 11px; color: #b0bccc; font-weight: 600; margin-left: 5px; }
.tt-big.up { color: #4ade80; } .tt-big.dn { color: #f87171; } .tt-big.nt { color: #cbd5e1; }
.tt-chip { display: inline-block; margin-top: 3px; font-size: 9.5px; font-weight: 800; border-radius: 5px; padding: 2px 7px; letter-spacing: .3px; max-width: 100%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.tt-chip.up { color: #052e16; background: #4ade80; }
.tt-chip.dn { color: #fff; background: #dc2626; }
.tt-chip.nt { color: #cbd5e1; background: rgba(148,163,184,.2); }
.tt-chip.pre { color: #ede9fe; background: rgba(139,92,246,.35); }

/* ölçer */
.tt-g { padding: 4px 12px 10px; }
.tt-bar { position: relative; height: 14px; border-radius: 7px; display: flex; border: 1px solid rgba(148,163,184,.18); }
.tt-bar span { display: block; flex: 2; transition: filter .3s, box-shadow .3s; }
.tt-bar .z-d { border-radius: 7px 0 0 7px; background: linear-gradient(90deg, rgba(96,165,250,.6), rgba(96,165,250,.18)); }
.tt-bar .z-n { background: repeating-linear-gradient(45deg, rgba(148,163,184,.16) 0 4px, rgba(148,163,184,.05) 4px 8px); }
.tt-bar .z-a { border-radius: 0 7px 7px 0; background: linear-gradient(90deg, rgba(245,158,11,.18), rgba(245,158,11,.65)); }
.tt-bar.on-d .z-a, .tt-bar.on-a .z-d { filter: saturate(.25) brightness(.7); }
.tt-bar.on-n .z-d, .tt-bar.on-n .z-a { filter: saturate(.4) brightness(.8); }
.tt-bar.on-d .z-d { box-shadow: 0 0 10px rgba(96,165,250,.55); }
.tt-bar.on-a .z-a { box-shadow: 0 0 10px rgba(245,158,11,.55); }
.tt-ndl { position: absolute; top: -4px; width: 3px; height: 20px; background: #fff; border-radius: 2px; box-shadow: 0 0 8px #fff; transform: translateX(-50%); transition: left .6s ease; }
.tt-lbl { display: flex; justify-content: space-between; font-size: 8.5px; font-weight: 700; margin-top: 5px; color: #a3afc1; white-space: nowrap; gap: 4px; }
.tt-lbl .d { color: #93c5fd; } .tt-lbl .a { color: #fcd34d; }

/* antrenör */
.tt-co { margin: 0 12px 8px; display: flex; align-items: center; gap: 8px; padding: 6px 8px; border-radius: 9px;
  background: linear-gradient(90deg, rgba(100,116,139,.16), rgba(100,116,139,.04)); border: 1px solid rgba(148,163,184,.3); }
.tt-co.ok { background: linear-gradient(90deg, rgba(168,85,247,.18), rgba(168,85,247,.04)); border-color: rgba(168,85,247,.45); }
.tt-co .av { position: relative; flex: 0 0 30px; width: 30px; height: 30px; border-radius: 50%; background: #1e1b4b; border: 1.5px solid #a78bfa; overflow: hidden; display: flex; align-items: center; justify-content: center; }
.tt-co .av img { width: 100%; height: 100%; object-fit: cover; position: absolute; inset: 0; }
.tt-co .av em { font-style: normal; font-size: 14px; }
.tt-co .av img + em { display: none; }
.tt-co .tx { flex: 1; min-width: 0; font-size: 9.5px; color: #c4b5fd; line-height: 1.35; }
.tt-co:not(.ok) .tx { color: #b0bccc; }
.tt-co .tx b { color: #f5d0fe; font-size: 10px; }
.tt-co:not(.ok) .tx b { color: #e2e8f0; }
.tt-co .st { flex: 0 0 auto; text-align: center; font-size: 9px; font-weight: 900; border-radius: 6px; padding: 3px 6px; line-height: 1.2; white-space: nowrap; color: #cbd5e1; background: rgba(148,163,184,.18); }
.tt-co.ok .st { color: #1e0533; background: #d8b4fe; }
.tt-co .st small { display: block; font-size: 8.5px; font-weight: 700; opacity: .85; }

/* hafta şeridi */
.tt-wk { margin: 0 12px; padding: 9px 0 10px; border-top: 1px dashed rgba(148,163,184,.18); display: flex; align-items: stretch; gap: 5px; }
.tt .q { position: relative; flex: 1; min-width: 0; border-radius: 8px; background: rgba(15,23,42,.7); border: 1px solid rgba(148,163,184,.14); text-align: center; padding: 4px 0 5px; }
.tt .q .g { font-size: 8.5px; font-weight: 800; color: #a3afc1; letter-spacing: .5px; }
.tt .q .i { font-size: 14px; line-height: 1.35; }
.tt .q .r { font-size: 10px; font-weight: 900; font-variant-numeric: tabular-nums; color: #b0bccc; white-space: nowrap; }
.tt .q.w { border-color: rgba(74,222,128,.45); } .tt .q.w .r { color: #4ade80; }
.tt .q.l { border-color: rgba(248,113,113,.45); } .tt .q.l .r { color: #f87171; }
.tt .q.pre .r { color: #c4b5fd; font-size: 8.5px; }
.tt .q.lv .r::after { content: '•'; margin-left: 1px; color: #f87171; }
.tt .q.ms { opacity: .55; }
.tt .q.now { border-color: #60a5fa; box-shadow: 0 0 0 1px #60a5fa inset, 0 0 10px rgba(96,165,250,.35); }
.tt .q.now .g { color: #93c5fd; }
.tt .q.fu { opacity: .35; border-style: dashed; }
.tt .q .cm { position: absolute; top: -6px; right: -4px; font-size: 8px; line-height: 13px; width: 15px; height: 15px; border-radius: 50%; background: #6d28d9; border: 1px solid #d8b4fe; }
.tt .tot { flex: 0 0 58px; border-radius: 8px; display: flex; flex-direction: column; align-items: center; justify-content: center; background: rgba(15,23,42,.7); border: 1px solid rgba(148,163,184,.3); }
.tt .tot.up { background: linear-gradient(180deg, #14532d, #0b2f1a); border-color: rgba(74,222,128,.5); }
.tt .tot.dn { background: linear-gradient(180deg, #7f1d1d, #3f0d0d); border-color: rgba(248,113,113,.5); }
.tt .tot .k { font-size: 8px; font-weight: 800; letter-spacing: 1px; color: #b0bccc; }
.tt .tot.up .k { color: #86efac; } .tt .tot.dn .k { color: #fca5a5; }
.tt .tot .v { font-size: 16px; font-weight: 900; font-variant-numeric: tabular-nums; color: #cbd5e1; }
.tt .tot.up .v { color: #4ade80; } .tt .tot.dn .v { color: #f87171; }
.tt .q.op { cursor: pointer; border-style: dashed; border-color: rgba(167,139,250,.55); opacity: 1; }
.tt .q.op .r { color: #c4b5fd; font-size: 9px; }
.tt .q.op.pl { border-style: solid; background: rgba(76,29,149,.35); }
.tt .q.op:hover { background: rgba(76,29,149,.5); }
.tt .q.op.sel { border-color: #fbbf24; box-shadow: 0 0 0 1px #fbbf24 inset, 0 0 10px rgba(251,191,36,.35); }
.tt-pick { margin: -2px 12px 6px; display: flex; align-items: center; gap: 4px; }
.tt-pick .d { flex: 0 0 auto; font-size: 10px; font-weight: 900; color: #fde68a; letter-spacing: .5px; margin-right: 2px; }
.tt-pick button { flex: 1 1 0; min-width: 0; display: flex; flex-direction: row; align-items: center; justify-content: center; gap: 2px; font-weight: 800; font-size: 9.5px; line-height: 1; font-family: inherit; letter-spacing: -.2px; padding: 3px 1px; height: 24px; box-sizing: border-box; overflow: hidden; text-overflow: ellipsis; border-radius: 8px; cursor: pointer; color: #e2e8f0; background: rgba(15,23,42,.85); border: 1px solid rgba(148,163,184,.3); white-space: nowrap; }
.tt-pick button i { font-style: normal; font-size: 11px; line-height: 1; flex: 0 0 auto; }
.tt-pick button.atk.on { background: #b45309; border-color: #fbbf24; color: #fff; }
.tt-pick button.def.on { background: #1d4ed8; border-color: #93c5fd; color: #fff; }
.tt-pick button.den.on { background: #334155; border-color: #cbd5e1; color: #fff; }
.tt-pickh { margin: -2px 12px 6px; font-size: 10px; font-weight: 900; color: #fde68a; letter-spacing: .6px; }
.tt-pickh small { font-weight: 700; color: #b0bccc; letter-spacing: 0; margin-left: 4px; }
.tt-pick .d { min-width: 40px; font-size: 8.5px !important; color: #a5b4fc !important; }
.tt-pick button.set.on { background: #7c2d12; border-color: #fb923c; color: #fff; }
.tt-pick.six { flex-wrap: nowrap; }   /* [2026-10-20] yedekler tek satırda, sayıya göre genişler/daralır */
.tt-pick.six button { flex: 1 1 0; font-size: 9.5px; padding: 4px 1px; letter-spacing: -.2px; }
.tt-pick button.six.on { background: #065f46; border-color: #34d399; color: #fff; }
.tt-pick em { font-size: 10px; color: #a3afc1; }
.tt .q .sx { position: absolute; bottom: -6px; right: -4px; font-size: 9px; width: 15px; height: 15px; border-radius: 50%; display: flex; align-items: center; justify-content: center; background: #422006; border: 1px solid #facc15; }
.tt .q[data-gun] { cursor: pointer; }
.tt .q[data-gun].sel { outline: 2px solid rgba(250,204,21,.7); outline-offset: 1px; }
.tt .tot.sw { cursor: pointer; position: relative; }
.tt .tot .g2 { margin-top: 2px; font-size: 7.5px; font-weight: 900; letter-spacing: .3px; color: #fde68a; white-space: nowrap; }
.tt-gd { margin: -2px 12px 9px; padding: 7px 9px; border-radius: 10px; background: rgba(2,6,23,.45); border: 1px solid rgba(250,204,21,.25); }
.tt-gd .h { font-size: 9.5px; font-weight: 900; letter-spacing: .6px; color: #fde68a; margin-bottom: 4px; }
.tt-gd .r { display: flex; align-items: center; gap: 6px; font-size: 11px; padding: 2px 0; color: #cbd5e1; }
.tt-gd .r .i { display: inline-flex; width: 16px; justify-content: center; color: #b0bccc; }
.tt-gd .r .n { flex: 1; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.tt-gd .r b { font-weight: 900; font-variant-numeric: tabular-nums; }
.tt-gd .r b.up { color: #4ade80; } .tt-gd .r b.dn { color: #f87171; } .tt-gd .r b.nt { color: #cbd5e1; }
.tt-gd .r em { font-style: normal; font-size: 9.5px; color: #a3afc1; min-width: 32px; text-align: right; }
.tt .q .sb { position: absolute; top: -6px; left: -4px; font-size: 9px; line-height: 15px; width: 15px; height: 15px; border-radius: 50%; background: #7c2d12; border: 1px solid #fdba74; }
.tt-dd { margin: 0 12px 9px; padding: 7px 9px; border-radius: 9px; background: rgba(6,78,59,.28); border: 1px solid rgba(52,211,153,.3); display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; font-size: 10.5px; color: #cbd5e1; }
.tt-dd .k { font-size: 9px; font-weight: 900; letter-spacing: .8px; color: #6ee7b7; width: 100%; }
.tt-dd .t { flex: 1; min-width: 0; }
.tt-dd .w { font-weight: 800; color: #b0bccc; }
.tt-dd b.up { color: #4ade80; } .tt-dd b.dn { color: #f87171; } .tt-dd b.nt { color: #cbd5e1; }
.tt-hint { margin: -4px 12px 9px; font-size: 10px; color: #a5b4fc; text-align: center; }
.tt-note { margin: -4px 12px 8px; font-size: 8.5px; color: #a3afc1; font-style: italic; text-align: right; }

/* başkan talepleri */
.tt-pr { margin: 0 12px; padding: 8px 0 9px; border-top: 1px dashed rgba(148,163,184,.18); }
.tt-pr .h { font-size: 9px; font-weight: 900; letter-spacing: 1px; color: #fbbf24; margin-bottom: 5px; }
.tt-pr .pr { display: flex; align-items: center; gap: 7px; font-size: 10px; margin: 4px 0; }
.tt-pr .n { flex: 1; min-width: 0; color: #cbd5e1; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.tt-pr .n small { font-size: 8px; font-weight: 800; color: #fbbf24; margin-left: 3px; }
.tt-pr .b { flex: 0 0 64px; height: 6px; border-radius: 3px; background: rgba(148,163,184,.18); overflow: hidden; }
.tt-pr .b i { display: block; height: 100%; background: linear-gradient(90deg, #f59e0b, #fbbf24); border-radius: 3px; }
.tt-pr .c { flex: 0 0 28px; text-align: right; font-weight: 800; color: #fde68a; font-variant-numeric: tabular-nums; }
.tt-pr .pr.dn .n { color: #86efac; } .tt-pr .pr.dn .b i { background: #4ade80; } .tt-pr .pr.dn .c { color: #4ade80; }

/* BIST100 dönem */
.tt-bx { display: flex; gap: 4px; padding: 8px 12px; background: rgba(2,6,23,.45); border-top: 1px solid rgba(148,163,184,.1); }
.tt-bx .c { flex: 1; text-align: center; }
.tt-bx .c.l { flex: 0 0 auto; text-align: left; padding-right: 4px; }
.tt-bx .k { font-size: 8px; color: #a3afc1; font-weight: 700; }
.tt-bx .v { font-size: 10px; font-weight: 800; font-variant-numeric: tabular-nums; color: #b0bccc; white-space: nowrap; }
.tt-bx .v.up { color: #4ade80; } .tt-bx .v.dn { color: #f87171; }

/* alt satır */
.tt-ft { display: flex; justify-content: space-between; gap: 6px; padding: 6px 12px 8px; font-size: 9px; color: #a3afc1; white-space: nowrap; }
.tt-ft b.atk { color: #fcd34d; } .tt-ft b.def { color: #93c5fd; } .tt-ft b.den { color: #e2e8f0; }
/* [2026-10-24] en küçük ölçekte bile sığmazsa kayar ama çubuk görünmez */
html.mobile-device #ticker-bist100-tip { scrollbar-width: none; }
html.mobile-device #ticker-bist100-tip::-webkit-scrollbar { display: none; }