/* KalaSutra Rivalry Oracle - styled with the main plugin's theme variables (--ks-*), so dark / light / combo / galaxy all follow the site. */
.ksr-wrap { --bg: var(--ks-bg, #23262a); --pn: var(--ks-panel-bg, #1a1c20); --tx: var(--ks-text, #f0f0f0); --bd: var(--ks-border, #d4af37); --ib: var(--ks-input-bg, #1a1c20); --ibd: var(--ks-input-border, rgba(212,175,55,.4)); --ac: var(--ks-accent-orange, #ea580c);
  --mut: color-mix(in srgb, var(--tx) 58%, transparent); --ln: color-mix(in srgb, var(--tx) 14%, transparent); --good: #10b981; --badc: #ef4444;
  color: var(--tx); font-family: 'Poppins', system-ui, sans-serif; font-size: 14px; line-height: 1.5; }
.ksr-wrap *, .ksr-wrap *::before, .ksr-wrap *::after { box-sizing: border-box; }
.ksr-head { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; justify-content: space-between; margin-bottom: 14px; }
.ksr-title { font-size: 22px; font-weight: 700; letter-spacing: .02em; color: var(--ks-title-middle, var(--tx)); }
.ksr-title span { color: var(--bd); }
.ksr-tabs { display: flex; gap: 6px; flex-wrap: wrap; }
.ksr-tab { background: transparent; color: var(--tx); border: 1px solid var(--ibd); padding: 7px 14px; border-radius: 6px; cursor: pointer; font: inherit; font-weight: 500; }
.ksr-tab.on { background: var(--bd); color: #111; border-color: var(--bd); }
.ksr-sec { display: none; } .ksr-sec.on { display: block; }
.ksr-panel { background: var(--pn); border: 1px solid var(--ibd); border-radius: 10px; padding: 16px; margin-bottom: 16px; box-shadow: var(--ks-shadow, 0 4px 15px rgba(0,0,0,.2)); }
.ksr-sh { font-weight: 600; font-size: 15px; margin-bottom: 12px; display: flex; flex-wrap: wrap; gap: 10px; align-items: center; color: var(--bd); }
.ksr-sh small { color: var(--mut); font-weight: 400; } .ksr-tools { margin-left: auto; display: flex; gap: 8px; align-items: center; }
.ksr-muted { color: var(--mut); font-size: 12px; } .ksr-grow { flex: 1 1 auto; }
.ksr-wrap input, .ksr-wrap select { width: 100%; background: var(--ib); color: var(--tx); border: 1px solid var(--ibd); border-radius: 6px; padding: 8px 10px; font: inherit; font-size: 13px; min-width: 0; }
.ksr-wrap input:focus, .ksr-wrap select:focus { outline: 2px solid var(--bd); outline-offset: 0; }
.ksr-wrap label { display: block; font-size: 11px; color: var(--mut); font-weight: 500; text-transform: uppercase; letter-spacing: .04em; }
.ksr-wrap label input, .ksr-wrap label select { margin-top: 3px; text-transform: none; letter-spacing: 0; }
.ksr-wrap label small { text-transform: none; }
.ksr-evbar { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 14px; } .ksr-evbar > label { flex: 1 1 140px; } .ksr-evbar > label.ksr-grow { flex: 2 1 220px; }
.ksr-slots { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.ksr-slot { border: 1px solid var(--ibd); border-top: 3px solid var(--c); border-radius: 8px; padding: 12px; background: color-mix(in srgb, var(--bg) 60%, var(--pn)); display: flex; flex-direction: column; gap: 8px; }
.ksr-slot-h { font-weight: 600; display: flex; gap: 8px; align-items: center; font-size: 13px; }
.ksr-dot { width: 10px; height: 10px; border-radius: 50%; background: var(--c); display: inline-block; flex: none; }
.ksr-who { min-height: 58px; font-size: 13px; } .ksr-who b { font-size: 15px; }
.ksr-slot-b { display: flex; gap: 14px; }
.ksr-link { background: none; border: 0; color: var(--bd); cursor: pointer; padding: 0; font: inherit; font-size: 12px; text-decoration: underline; }
.ksr-actions { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; margin-top: 14px; }
.ksr-btn { background: var(--ib); color: var(--tx); border: 1px solid var(--bd); border-radius: 6px; padding: 9px 16px; cursor: pointer; font: inherit; font-weight: 600; font-size: 13px; }
.ksr-btn:hover { background: color-mix(in srgb, var(--bd) 18%, var(--ib)); } .ksr-btn.sm { padding: 6px 12px; font-size: 12px; } .ksr-btn.ghost { border-color: var(--ibd); font-weight: 500; }
.ksr-btn.go { background: linear-gradient(135deg, var(--ac), #c2185b); color: #fff; border-color: transparent; } .ksr-btn.go:hover { filter: brightness(1.1); } .ksr-btn:disabled { opacity: .5; cursor: wait; }
.ksr-msg { min-height: 20px; margin-top: 8px; font-size: 13px; color: var(--mut); } .ksr-msg.warn { color: #f59e0b; } .ksr-msg.bad { color: var(--badc); }
.ksr-sugwrap { position: relative; display: block; }
.ksr-sug { display: none; position: absolute; z-index: 30; left: 0; right: 0; top: 100%; margin: 2px 0 0; padding: 0; list-style: none; background: var(--pn); border: 1px solid var(--bd); border-radius: 6px; max-height: 220px; overflow: auto; box-shadow: 0 8px 24px rgba(0,0,0,.35); }
.ksr-sug li { padding: 8px 10px; cursor: pointer; font-size: 13px; text-transform: none; letter-spacing: 0; color: var(--tx); } .ksr-sug li:hover { background: color-mix(in srgb, var(--bd) 20%, transparent); } .ksr-sug li.dim { color: var(--mut); cursor: default; }
/* grids */
.ksr-grid { display: grid; gap: 12px; align-items: start; } .ksr-g2 { grid-template-columns: repeat(2, minmax(0, 1fr)); } .ksr-g3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.ksr-card { border: 1px solid var(--ln); border-top: 3px solid var(--c); border-radius: 8px; padding: 10px; min-width: 0; background: color-mix(in srgb, var(--bg) 55%, var(--pn)); overflow-x: auto; }
.ksr-ch { display: flex; gap: 8px; align-items: center; margin-bottom: 4px; } .ksr-snap { font-size: 12px; color: var(--mut); margin-bottom: 6px; }
.ksr-svg { width: 100%; height: auto; display: block; max-width: 440px; margin: 0 auto; }
.ksr-svg .cell { fill: none; stroke: var(--bd); stroke-width: 1.4; } .ksr-svg .cell.lagna { fill: color-mix(in srgb, var(--bd) 10%, transparent); }
.ksr-svg .sg { fill: var(--mut); font-size: 11px; } .ksr-svg .pl { font-size: 14px; font-weight: 700; } .ksr-svg .pl .dg { font-size: 10px; font-weight: 400; fill: var(--mut); } .ksr-svg .pl .r { font-size: 10px; }
.ksr-svg .asc { stroke: var(--ac); stroke-width: 3; } .ksr-svg .ascl { fill: var(--ac); font-size: 10px; font-weight: 700; }
.ksr-svg .ct { fill: var(--tx); font-size: 14px; font-weight: 700; } .ksr-svg .cs { fill: var(--mut); font-size: 11px; }
.ksr-seg { display: inline-flex; border: 1px solid var(--ibd); border-radius: 6px; overflow: hidden; } .ksr-seg button { background: transparent; color: var(--tx); border: 0; padding: 6px 12px; cursor: pointer; font: inherit; font-size: 12px; } .ksr-seg button.on { background: var(--bd); color: #111; }
.ksr-tools select { width: auto; min-width: 190px; }
/* tables */
.ksr-scroll { overflow-x: auto; }
.ksr-tbl { width: 100%; border-collapse: collapse; font-size: 12px; margin: 0 0 8px; background: transparent; }
.ksr-tbl th, .ksr-tbl td { border-bottom: 1px solid var(--ln); padding: 5px 6px; text-align: left; vertical-align: top; color: var(--tx); background: transparent; }
.ksr-tbl thead th { color: var(--bd); font-weight: 600; white-space: nowrap; border-bottom: 1px solid var(--ibd); }
.ksr-tbl tr.now td { background: color-mix(in srgb, var(--bd) 22%, transparent); font-weight: 600; }
.ksr-sub { font-size: 11px; text-transform: uppercase; letter-spacing: .05em; color: var(--bd); margin: 10px 0 4px; font-weight: 600; }
.ksr-cmp th:first-child { width: 28%; } .ksr-cmp td.top .ksr-bar span { font-weight: 800; } .ksr-cmp tr.tot th, .ksr-cmp tr.tot td { border-top: 2px solid var(--ibd); font-weight: 700; }
.ksr-bar { position: relative; height: 22px; border-radius: 4px; background: var(--ln); overflow: hidden; min-width: 90px; } .ksr-bar i { position: absolute; inset: 0 auto 0 0; width: var(--w); background: var(--c); opacity: .8; } .ksr-bar span { position: relative; z-index: 1; padding: 0 8px; line-height: 22px; font-size: 12px; font-weight: 600; color: var(--tx); mix-blend-mode: normal; text-shadow: 0 0 4px var(--pn), 0 0 2px var(--pn); }
.ksr-pn th.pos { color: var(--good); } .ksr-pn th.neg { color: var(--badc); } .ksr-pn td { width: 50%; }
.ksr-tag { display: inline-block; font-size: 9px; text-transform: uppercase; letter-spacing: .04em; border: 1px solid var(--ibd); border-radius: 3px; padding: 0 4px; color: var(--mut); margin-right: 3px; }
.ksr-rs tr.layer td, .ksr-rs tr.total td { font-weight: 600; background: color-mix(in srgb, var(--bd) 7%, transparent); }
.v-good { color: var(--good); font-weight: 600; } .v-bad { color: var(--badc); font-weight: 600; } .v-none, .v-na { color: var(--mut); } .ok { color: var(--good); } .bad { color: var(--badc); }
/* prose + verdict */
.ksr-prose p { margin: 0 0 10px; max-width: 90ch; } .ksr-note { color: var(--mut); font-size: 12.5px; margin: 12px 0 0; max-width: 100ch; }
.ksr-verdict { display: flex; flex-wrap: wrap; align-items: baseline; gap: 12px; margin-bottom: 14px; } .ksr-verdict span { font-size: 26px; font-weight: 700; } .ksr-verdict em { font-style: normal; color: var(--ac); font-weight: 600; }
.ksr-winrow { display: grid; grid-template-columns: minmax(120px, 220px) 1fr; gap: 6px 14px; align-items: center; margin-bottom: 14px; } .ksr-winrow .n { font-weight: 600; border-left: 4px solid var(--c); padding-left: 8px; }
.ksr-winrow .b { display: flex; align-items: center; gap: 10px; grid-column: 2; } .ksr-winrow .bar { flex: 1; height: 20px; background: var(--ln); border-radius: 4px; overflow: hidden; } .ksr-winrow .bar i { display: block; height: 100%; background: var(--c); } .ksr-winrow .b b { min-width: 44px; text-align: right; font-size: 16px; }
.ksr-winrow .b.sub .bar { height: 10px; } .ksr-winrow .b.sub .bar i { opacity: .45; } .ksr-winrow .b.sub b { font-size: 13px; color: var(--mut); }
.ksr-legend { display: flex; flex-wrap: wrap; gap: 6px 20px; font-size: 11.5px; color: var(--mut); } .ksr-legend i { display: inline-block; width: 22px; height: 8px; border-radius: 2px; background: var(--ac); margin-right: 6px; } .ksr-legend i.b { opacity: .45; height: 5px; }
.ksr-presets { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 12px; margin-top: 12px; }
.ksr-preset { text-align: left; background: var(--ib); color: var(--tx); border: 1px solid var(--ibd); border-radius: 8px; padding: 12px; cursor: pointer; font: inherit; display: flex; flex-direction: column; gap: 6px; } .ksr-preset b { color: var(--bd); } .ksr-preset span { font-size: 12px; color: var(--mut); } .ksr-preset.on, .ksr-preset:hover { border-color: var(--bd); background: color-mix(in srgb, var(--bd) 10%, var(--ib)); }
.ksr-chips { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 4px; } .ksr-chip, .ksr-chk { display: inline-flex !important; align-items: center; gap: 6px; text-transform: none !important; font-size: 12px !important; color: var(--tx) !important; } .ksr-chip input, .ksr-chk input { width: auto !important; margin: 0 !important; }
/* modal */
.ksr-modal { position: fixed; inset: 0; background: rgba(0,0,0,.6); z-index: 99999; display: flex; align-items: flex-start; justify-content: center; padding: 20px 12px; overflow-y: auto; } .ksr-modal[hidden] { display: none; }
body.ksr-lock { overflow: hidden; }
.ksr-dlg { background: var(--pn); color: var(--tx); border: 1px solid var(--bd); border-radius: 12px; width: min(1180px, 100%); box-shadow: 0 20px 60px rgba(0,0,0,.5); font-family: 'Poppins', system-ui, sans-serif; font-size: 14px; }
.ksr-dlg *, .ksr-dlg *::before { box-sizing: border-box; }
.ksr-dlg input, .ksr-dlg select { width: 100%; background: var(--ib); color: var(--tx); border: 1px solid var(--ibd); border-radius: 6px; padding: 8px 10px; font: inherit; font-size: 13px; min-width: 0; }
.ksr-dlg label { display: block; font-size: 11px; color: var(--mut); font-weight: 500; text-transform: uppercase; letter-spacing: .04em; } .ksr-dlg label input, .ksr-dlg label select { margin-top: 3px; text-transform: none; }
.ksr-dlg-h { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; padding: 14px 16px; border-bottom: 1px solid var(--ibd); } .ksr-dlg-h b { font-size: 16px; color: var(--bd); } .ksr-x { margin-left: auto; background: none; border: 0; color: var(--tx); font-size: 18px; cursor: pointer; }
.ksr-dlg-b { padding: 16px; } .ksr-cols3 { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.ksr-form { border: 1px solid var(--ln); border-top: 3px solid var(--c); border-radius: 8px; padding: 12px; display: flex; flex-direction: column; gap: 9px; }
.ksr-row2 { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; align-items: end; } .ksr-row3 { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 6px; }
.ksr-tzhint { font-size: 11px; color: var(--mut); min-height: 16px; } .ksr-form-b { display: flex; gap: 6px; flex-wrap: wrap; } .ksr-form-b select { flex: 1 1 120px; width: auto; } .ksr-formmsg { font-size: 12px; min-height: 16px; color: var(--mut); } .ksr-formmsg.ok { color: var(--good); } .ksr-formmsg.bad { color: var(--badc); }
.ksr-dlg-f { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; padding: 12px 16px; border-top: 1px solid var(--ibd); }
@media (max-width: 960px) { .ksr-g3, .ksr-g2, .ksr-slots, .ksr-cols3 { grid-template-columns: 1fr; } .ksr-tools { margin-left: 0; width: 100%; } .ksr-tools select { flex: 1; } .ksr-winrow { grid-template-columns: 1fr; } .ksr-winrow .b { grid-column: 1; } }