/* Drop Finder (index.html): its own rules on top of style.css */
.bar{margin:14px 0 10px}
table{min-width:640px}
tbody tr:nth-child(even){background:var(--zebra)}
tbody tr:hover{background:var(--hl)}
.box{position:relative}
input[type=text]{width:100%;padding:11px 14px 11px 38px;border:1px solid var(--bd);border-radius:8px;background:var(--card) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none' stroke='%239ca3af' stroke-width='2' viewBox='0 0 24 24'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='m20 20-3.5-3.5'/%3E%3C/svg%3E") 12px center no-repeat;color:var(--tx);font:inherit;font-size:14px;box-shadow:0 1px 2px rgba(0,0,0,.04)}
section>.box{max-width:620px}section>.box input[type=text]{padding:8px 12px 8px 36px;font-size:13px}
.gsearch input[type=text]{padding:8px 10px 8px 32px;background-position:10px center;font-size:12px}
.sug{position:absolute;left:0;right:0;top:100%;margin-top:4px;background:var(--card);border:1px solid var(--bd);border-radius:8px;max-height:340px;overflow:auto;z-index:8;box-shadow:0 10px 30px rgba(0,0,0,.15)}
.sug div{padding:8px 14px;cursor:pointer;display:flex;justify-content:space-between;gap:10px;color:var(--tx)}
.sug div:hover,.sug div.act{background:var(--hl)}.sug small{color:var(--mu)}
.bar input[type=text]{width:220px;padding:6px 10px 6px 32px;background-position:10px center;font-size:12px;margin-left:auto}
.pick select{min-width:220px;max-width:100%}
.stick>.bar:first-child{margin-top:20px}
#rune-head>.bar:first-child{margin-top:0}
/* the filter rows stay at the top while scrolling; table headers stick just below them (--stick, set by drop-finder.js) */
.stick{position:sticky;top:0;z-index:4;background:var(--bg);padding-bottom:1px}
th{position:sticky;top:var(--stick,0px);z-index:2}
.recent{display:flex;flex-wrap:wrap;gap:6px 8px;align-items:center;margin:10px 0 0;font-size:12px}
.recent .lbl{font-size:10px;text-transform:uppercase;letter-spacing:.1em;color:var(--mu);margin-right:2px}
.recent .rc{background:var(--card);border:1px solid var(--bd);border-radius:999px;padding:2px 10px}
.recent .rk{color:var(--mu);font-size:10px;margin-left:5px}
.recent .rclear{color:var(--mu);font-size:11px;text-decoration:none;margin-left:4px}.recent .rclear:hover{color:var(--ac)}
/* long number headers ("Expected per run") take two lines instead of widening their column */
th.n{white-space:normal;min-width:64px}
#item-results>.card>table>tbody>tr>td:nth-child(-n+2){white-space:normal;min-width:150px}
/* drop chance colour: strong from 10%, fading towards tiny chances */
td.n b.r4{font-weight:800;background:var(--hl);padding:1px 6px;border-radius:4px}
td.n b.r3{font-weight:600}td.n b.r2{color:var(--tx);font-weight:600}td.n b.r1{color:var(--mu);font-weight:600}td.n b.r0{color:var(--mu);font-weight:500;opacity:.75}
td.pk{color:var(--mu)}td.bun{white-space:normal;min-width:260px}td.bun .sub{font-size:11px}
.odds{color:var(--mu);font-size:10px;font-weight:400;margin-right:6px;cursor:help;white-space:nowrap}
td.w{white-space:normal;color:var(--mu);font-size:12px}
tr.gr{cursor:pointer}tr.tiny td{color:var(--mu);font-size:12px;font-style:italic}td.mons{background:var(--hl)!important;line-height:1.8}
.boss{background:#f43f5e;color:#fff;font-weight:700;font-size:9px;letter-spacing:.08em;margin-left:6px;padding:1px 5px;border-radius:3px;vertical-align:1px}
.mon{border-bottom:1px solid var(--bd)}.mon:last-child{border:0}
.mh{display:flex;gap:10px;align-items:center;padding:9px 12px;cursor:pointer}
.mh:hover{background:var(--hl)}.mh b{font-weight:600}
.mh .c{margin-left:auto;font-size:11px;background:var(--chip);color:var(--mu);padding:1px 8px;border-radius:999px}
.arr{width:10px;color:var(--mu)}
.mon table{border-top:1px solid var(--bd)}
.mon.child{border-bottom:0;border-top:1px dashed var(--bd)}.mon.child>.mh{padding-left:34px}.mon.child>.mh b{font-weight:500}.mh.nodrop{cursor:default}.mh.nodrop:hover{background:none}.mh.nodrop b,.mh.nodrop .sub{opacity:.7}
.more{display:block;margin:12px auto 0;padding:7px 16px;border:1px solid var(--bd);background:var(--card);color:var(--tx);border-radius:6px;cursor:pointer;font:inherit}
.more:hover{border-color:var(--ac);color:var(--ac)}
a.ml{color:var(--ac);text-decoration:none}a.ml:hover{text-decoration:underline}
#rune-results>.card>table>*>tr>th,#rune-results>.card>table>*>tr>td{padding-left:10px;padding-right:10px}#rune-results>.card>table>tbody>tr>td:nth-child(3){white-space:normal;min-width:150px}
/* opened rune / recipe details: a quiet panel inside the row, not a second striped table */
tr.rlrow{background:none!important}.rl{padding:8px 12px 12px!important;background:var(--bg)!important;border-top:1px solid var(--bd);border-bottom:1px solid var(--bd)}
.rl table{width:auto;min-width:0;margin:0;border:1px solid var(--bd);border-radius:6px;background:var(--card)}.rl tbody tr,.rl tbody tr:hover{background:none}
.rl th{position:static;font-size:11px;padding:5px 12px;text-transform:none;letter-spacing:0;color:var(--mu);font-weight:500;background:none}.rl td{font-size:12px;padding:5px 12px}
.lvgrid th{text-align:left;border-bottom:0;border-right:1px solid var(--bd);white-space:nowrap}.lvgrid td{text-align:center;min-width:42px;font-variant-numeric:tabular-nums}.lvgrid tr:first-child th,.lvgrid tr:first-child td{border-bottom:1px solid var(--bd)}.lvgrid tr:first-child b{color:var(--tx)}
/* on wide screens the tables fit, so the cards don't scroll sideways and the headers can stick to the page */
@media (min-width:1101px){.card{overflow:visible}}
@media (max-width:760px){
  .bar input[type=text]{margin-left:0;width:100%}
  .stick{position:static}
}