/* スマグロ実測ノート：1カラム・文字が主役 */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:#fafaf7;color:#222;font-family:"Hiragino Kaku Gothic ProN","Hiragino Sans","Noto Sans JP","Yu Gothic",Meiryo,sans-serif;font-size:17px;line-height:1.85;letter-spacing:.02em;word-break:normal;overflow-wrap:anywhere;line-break:strict}
a{color:#1a5fb4}
a:hover{text-decoration:none}
.site-header{background:#fff;border-bottom:1px solid #e3e3dc}
.site-header .inner{max-width:720px;margin:0 auto;padding:12px 18px}
.site-name{font-weight:700;font-size:18px;color:#222;text-decoration:none}
.site-tagline{display:block;font-size:13px;color:#666;line-height:1.5}
main{max-width:720px;margin:0 auto;padding:8px 18px 40px}
.breadcrumb{font-size:13px;color:#666;margin:12px 0 4px;padding:0;list-style:none;display:flex;flex-wrap:wrap}
.breadcrumb li+li::before{content:"›";margin:0 .5em;color:#999}
h1{font-size:24px;line-height:1.5;margin:.6em 0 .3em}
h2{font-size:20px;line-height:1.5;margin:2.2em 0 .6em;padding:.2em 0 .2em .6em;border-left:5px solid #2b6cb0}
h3{font-size:18px;line-height:1.5;margin:1.8em 0 .5em}
p,ul,ol{margin:0 0 1.1em}
li{margin-bottom:.3em}
.updated{font-size:13px;color:#666;margin:0 0 1.2em}
.answer{background:#fff;border:2px solid #2b6cb0;border-radius:8px;padding:14px 16px;margin:1em 0 1.6em}
.answer p:last-child{margin-bottom:0}
.note{background:#f3f1ea;border-radius:6px;padding:10px 14px;font-size:15px;color:#444}
.guess{display:inline-block;font-size:12px;line-height:1.6;padding:0 .5em;border-radius:3px;background:#fff3cd;color:#7a5a00;border:1px solid #e6c766;vertical-align:.1em}
.todo{display:inline-block;font-size:13px;line-height:1.6;padding:0 .5em;border-radius:3px;background:#fde8e8;color:#9b1c1c;border:1px dashed #d98c8c}
.table-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch;margin:0 0 1.4em}
table{border-collapse:collapse;width:100%;min-width:480px;background:#fff;font-size:15px;line-height:1.6}
th,td{border:1px solid #d9d9d0;padding:8px 10px;text-align:left;vertical-align:top}
thead th{background:#eef3f9}
tbody th{background:#f7f7f2;white-space:nowrap}
caption{caption-side:bottom;text-align:left;font-size:13px;color:#666;padding-top:6px}
.article-list{list-style:none;padding:0;counter-reset:n}
.article-list li{counter-increment:n;background:#fff;border:1px solid #e3e3dc;border-radius:6px;padding:10px 14px;margin-bottom:8px}
.article-list li::before{content:counter(n) ". ";font-weight:700;color:#2b6cb0}
.article-list .soon{color:#888;font-size:13px;margin-left:.5em}
.faq dt{font-weight:700;margin-top:1.2em}
.faq dt::before{content:"Q. ";color:#2b6cb0}
.faq dd{margin:.3em 0 0}
.faq dd::before{content:"A. ";font-weight:700;color:#b7791f}
.sources{font-size:14px}
.site-footer{border-top:1px solid #e3e3dc;background:#fff;font-size:13px;color:#555;line-height:1.7}
.site-footer .inner{max-width:720px;margin:0 auto;padding:18px}
.site-footer p{margin:0 0 .4em}
@media (min-width:768px){body{font-size:17px}h1{font-size:28px}}
/* 最適装備・ダメージ計算機 */
.opt-app input,.opt-app select{font:inherit;font-size:16px;width:100%;min-width:0;padding:6px 8px;border:1px solid #c9c9bf;border-radius:4px;background:#fff;color:#222}
.opt-app input[type=checkbox]{width:auto;margin:0 .4em 0 0;vertical-align:-.1em}
.opt-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px 10px;margin:0 0 .8em}
.opt-grid-4{grid-template-columns:repeat(4,minmax(0,1fr))}
.opt-field{display:block;font-size:13px;line-height:1.4;color:#555}
.opt-field span{display:block;margin-bottom:2px}
.opt-wide{grid-column:1/-1}
.opt-check{display:inline-block;font-size:14px;line-height:1.5;margin:.2em 0}
.opt-hint{font-size:14px;color:#555;margin:.2em 0 .8em}
.opt-sub{font-size:14px;font-weight:700;margin:.4em 0 .3em}
.opt-warn{font-size:14px;color:#9b1c1c;background:#fde8e8;border-radius:4px;padding:6px 10px;margin:.4em 0}
.opt-slot{background:#fff;border:1px solid #e3e3dc;border-radius:6px;margin:0 0 8px}
.opt-slot>summary{cursor:pointer;padding:10px 14px;font-weight:700}
.opt-count{font-weight:400;font-size:13px;color:#666;margin-left:.6em}
.opt-cand{border-top:1px solid #eee;padding:10px 14px}
.opt-cand.is-equipped{background:#f3f8fd}
.opt-cand-head{display:flex;flex-wrap:wrap;gap:6px 10px;align-items:center;margin-bottom:8px}
.opt-cand-head input[type=text]{flex:1 1 160px}
.opt-slot-foot{display:flex;flex-wrap:wrap;gap:6px 14px;align-items:center;padding:8px 14px 12px;border-top:1px solid #eee}
.opt-btn{font:inherit;font-weight:700;font-size:17px;background:#2b6cb0;color:#fff;border:0;border-radius:6px;padding:10px 28px;cursor:pointer}
.opt-btn-small{font:inherit;font-size:14px;background:#fff;color:#2b6cb0;border:1px solid #2b6cb0;border-radius:4px;padding:4px 12px;cursor:pointer}
.opt-btn-small:disabled{color:#aaa;border-color:#ccc;cursor:default}
.opt-actions{display:flex;flex-wrap:wrap;gap:10px 16px;align-items:center;margin:1.4em 0}
.opt-results{list-style:none;padding:0;margin:0 0 1em}
.opt-res,.opt-current{background:#fff;border:1px solid #e3e3dc;border-radius:6px;padding:10px 14px;margin:0 0 10px}
.opt-current{border:2px solid #b7791f}
.opt-res:first-child{border:2px solid #2b6cb0}
.opt-rank{font-weight:700;margin:0;font-size:15px}
.opt-diff{font-weight:400;font-size:14px;margin-left:.8em;color:#555}
.opt-diff.up{color:#1f7a3a;font-weight:700}
.opt-diff.down{color:#9b1c1c}
.opt-dmg{font-size:22px;font-weight:700;margin:.1em 0 .4em;line-height:1.4}
.opt-dmg span{display:inline-block;font-size:14px;font-weight:400;color:#555;margin-left:.8em}
.opt-items{list-style:none;padding:0;margin:0 0 .4em;font-size:14px;line-height:1.6}
.opt-items li{margin:0;padding:2px 0;border-bottom:1px dotted #e3e3dc}
.opt-slotname{display:inline-block;min-width:9.5em;color:#666;font-size:13px}
.opt-tag{font-size:12px;background:#eef3f9;color:#2b6cb0;border-radius:3px;padding:0 .4em;margin-left:.4em}
.opt-detail{font-size:14px}
.opt-detail summary{cursor:pointer;color:#1a5fb4}
.opt-detail ul{margin:.4em 0 0;padding-left:1.2em}
@media (max-width:420px){.opt-grid-4{grid-template-columns:repeat(2,minmax(0,1fr))}.opt-cand,.opt-slot>summary,.opt-slot-foot{padding-left:10px;padding-right:10px}}
.opt-icon{display:inline-block;vertical-align:middle;object-fit:contain;flex:none}
.opt-hint .opt-icon,.opt-cand-name .opt-icon,.opt-party .opt-icon{margin:0 2px}
.opt-items .opt-icon{margin-right:4px}
.opt-cand-name{flex:1 1 150px;min-width:0;line-height:1.4}
.opt-cand-name b{display:block}
.opt-cand-name span{display:block;font-size:13px;color:#555}
.opt-sum{font-size:14px;margin:.2em 0}
.opt-fx{font-size:13px;margin:.2em 0}
.opt-fx summary{cursor:pointer;color:#1a5fb4}
.opt-fx ul{margin:.3em 0;padding-left:1.2em}
.opt-fx-off li{color:#888}
.opt-fx-off small,.opt-party small{display:block;font-size:12px;color:#888}
.opt-party{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:6px;margin:0 0 1em}
.opt-party-item{background:#fff;border:1px solid #e3e3dc;border-radius:6px;padding:6px 8px;margin:0;font-size:14px}
.opt-party-item.is-dim{color:#888}
.opt-unk{display:block;font-size:12px;color:#9b1c1c}
.opt-noscroll{overflow:hidden}
.opt-picker{position:fixed;inset:0;z-index:50;background:rgba(0,0,0,.45);display:flex;align-items:flex-end;justify-content:center}
.opt-picker[hidden]{display:none}
.opt-picker-box{background:#fafaf7;width:100%;max-width:720px;max-height:88vh;display:flex;flex-direction:column;border-radius:12px 12px 0 0;padding:12px 14px 0}
.opt-picker-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}
.opt-picker-box input[type=search]{font:inherit;font-size:16px;width:100%;padding:10px 12px;border:1px solid #c9c9bf;border-radius:6px}
.opt-picker-head,.opt-picker-box input[type=search],.opt-picker-filter{flex:none}
.opt-picker-filter{min-height:8px;padding:6px 0 8px}
.opt-picker-list{list-style:none;margin:0;padding:0 0 16px;overflow-y:auto;-webkit-overflow-scrolling:touch;flex:1}
.opt-picker-list li{margin:0 0 6px}
.opt-pick-item{display:flex;align-items:center;gap:10px;width:100%;min-height:56px;text-align:left;font:inherit;background:#fff;border:1px solid #e3e3dc;border-radius:8px;padding:6px 10px;cursor:pointer;color:#222}
.opt-pick-item:active{background:#eef3f9}
.opt-pick-item span{min-width:0;line-height:1.4}
.opt-pick-item b{display:block;font-size:15px}
.opt-pick-item small{display:block;font-size:12px;color:#666}
@media (min-width:768px){.opt-picker{align-items:center}.opt-picker-box{border-radius:12px;max-height:80vh}}
/* 記事 */
.inline-icon{display:inline-block;vertical-align:-5px;margin-right:4px;object-fit:contain}
.table-note{font-size:13px;color:#666;margin:6px 0 0}
.related{padding-left:1.2em}
