body { font-family: system-ui, sans-serif; margin: 2rem auto; max-width: 1100px; padding: 0 1rem; color: #1b1b1b; }
h1 { margin-bottom: .2rem; }
.sub { color: #555; max-width: 70ch; }
form { display: flex; gap: .8rem; align-items: end; flex-wrap: wrap; margin: 1.2rem 0; }
input { font-size: 1rem; padding: .5rem; min-width: 320px; }
button { font-size: 1rem; padding: .55rem 1rem; cursor: pointer; }
table { border-collapse: collapse; width: 100%; margin-top: 1rem; }
th, td { border: 1px solid #ddd; padding: .45rem .6rem; text-align: left; vertical-align: top; }
tbody tr { cursor: pointer; }
tbody tr:hover { background: #f6f6f6; }
td.why { font-size: .85rem; color: #444; }
.lvl-gem td { background: #eefbea; }
.lvl-skip td { color: #888; }
.method { font-size: .85rem; color: #666; max-width: 90ch; }
#detail { margin-top: 1.5rem; border-top: 2px solid #eee; padding-top: 1rem; }