
:root { --bg:#faf7f0; --fg:#2b2620; --sub:#6b6358; --line:#e2dccf; --accent:#8a5a1c; --chip:#f1e8d6;
        --fire:#c0392b; --water:#2471a3; --wind:#1e8449; --light:#b7950b; --dark:#6c3483; }
@media (prefers-color-scheme: dark) { :root { --bg:#1d1b18; --fg:#ece6da; --sub:#a59d90; --line:#3a352e; --accent:#e0a95a; --chip:#2c2822;
        --fire:#ff7b6b; --water:#6fb3ec; --wind:#6fd49a; --light:#f0d060; --dark:#c79be0; } }
* { box-sizing:border-box; }
body { margin:0; background:var(--bg); color:var(--fg); font-family:system-ui,-apple-system,"Hiragino Sans","Yu Gothic UI",Meiryo,sans-serif; line-height:1.7; }
header, main, footer { max-width:880px; margin:0 auto; padding:0 16px; }
header { padding-top:14px; }
nav.top { display:flex; flex-wrap:wrap; gap:6px 14px; font-size:.88rem; }
nav.crumb { color:var(--sub); font-size:.8rem; margin:10px 0 0; }
a, a:visited { color:var(--accent); text-underline-offset:2px; text-decoration-color:color-mix(in srgb, var(--accent) 45%, transparent); }
a:hover { text-decoration-color:currentColor; }
h1 { font-size:1.35rem; margin:8px 0 6px; line-height:1.4; }
h2 { font-size:1.08rem; margin:26px 0 8px; padding:4px 8px; border-left:4px solid var(--accent); background:var(--chip); }
h3 { font-size:.98rem; margin:16px 0 4px; }
.lead { color:var(--sub); font-size:.92rem; }
table { width:100%; border-collapse:collapse; font-size:.92rem; }
th, td { text-align:left; padding:5px 6px; border-bottom:1px solid var(--line); vertical-align:top; }
th { color:var(--sub); font-weight:500; font-size:.8rem; }
.cell { display:inline-block; background:var(--chip); border-radius:4px; padding:0 6px; margin:1px 2px; font-family:ui-monospace,Consolas,monospace; }
td a, h3 a, li a { white-space:nowrap; }       /* モンスター名・宝珠名・マップ名は途中で折り返さない（名前と名前の間では折り返す） */
table.lv { width:auto; min-width:min(100%, 420px); }
table.lv td:first-child { min-width:5.5em; white-space:nowrap; }
table.lv td:last-child { text-align:right; white-space:nowrap; }
.wi { display:block; }                          /* 特殊枠の出現場所は1項目1行 */
.wi + .wi { border-top:1px dashed var(--line); margin-top:2px; padding-top:2px; }
.tag + .wi { margin-top:3px; }
td:first-child { min-width:7em; }
.loc { padding:3px 0; }
.loc + .loc { border-top:1px dashed var(--line); }
.loc b { font-weight:600; }
.chips { display:flex; flex-wrap:wrap; gap:6px 8px; }
.chip { display:inline-flex; align-items:center; white-space:nowrap; padding:1px 8px 1px 2px; border:1px solid var(--line); border-radius:6px; font-size:.88rem; }
.chip .el { margin-right:5px; }
.chip.more { padding:1px 8px; color:var(--sub); }
td.map { min-width:9em; }
td.map .rg { display:block; width:max-content; margin:0 0 2px; }
.rg { white-space:nowrap; }
.rg { display:inline-block; font-size:.72rem; color:var(--sub); border:1px solid var(--line); border-radius:4px; padding:0 5px; margin-right:5px; }
.el { display:inline-block; font-size:.75rem; font-weight:600; border:1px solid currentColor; border-radius:4px; padding:0 5px; margin-right:6px; }
.el.炎 { color:var(--fire); } .el.水 { color:var(--water); } .el.風 { color:var(--wind); } .el.光 { color:var(--light); } .el.闇 { color:var(--dark); }
.tag { display:inline-block; font-size:.75rem; border:1px solid var(--line); border-radius:999px; padding:0 8px; margin:2px 4px 2px 0; text-decoration:none; }
.note { color:var(--sub); font-size:.84rem; }
.score { font-weight:700; color:var(--accent); }
ul.cols { columns:2 14em; padding-left:1.2em; }
footer { padding:28px 16px 40px; color:var(--sub); font-size:.8rem; }
