/* 2045年の値段：ゲーム固有のスタイル（色は CSS 変数のみ） */
:root { --mi-tag-old: #f0ede6; --mi-tag-new: #fff6e0; --mi-ok: #2e9e6a; --mi-lin: #c98a12; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) { --mi-tag-old: #2b2820; --mi-tag-new: #3a2a19; --mi-ok: #4cc48b; --mi-lin: #e0a53a; } }
:root[data-theme="dark"] { --mi-tag-old: #2b2820; --mi-tag-new: #3a2a19; --mi-ok: #4cc48b; --mi-lin: #e0a53a; }

.mi-hero { border-radius: var(--radius); overflow: hidden; box-shadow: var(--shadow); margin: 4px 0 12px; background: var(--surface-2); line-height: 0; }
.mi-art { width: 100%; height: auto; display: block; }
.mi-year { animation: mi-flick 2.4s steps(1) infinite; }
@keyframes mi-flick { 0%, 100% { opacity: 1; } 48% { opacity: 1; } 50% { opacity: .35; } 52% { opacity: 1; } }
.mi-title-img { width: 100%; height: auto; display: block; aspect-ratio: 16 / 9; object-fit: cover; }
.mi-h1 { margin: 2px 0 6px; }
.mi-h1-sub { display: block; font-size: 16px; color: var(--accent); font-weight: 800; margin-top: 2px; }
.mi-friend { border: 2px solid var(--accent); background: var(--accent-soft); margin-bottom: 12px; }
.mi-daily { border: 2px solid var(--accent); }
.mi-daily .btn { margin-top: 10px; }
.mi-free { margin: 12px 0 8px; }
.mi-disclaimer { font-size: 11px; color: var(--text-sub); background: var(--surface-2); border-radius: var(--radius-sm); padding: 8px 10px; margin: 16px 0 0; line-height: 1.6; }

/* 出題 */
.mi-top { display: flex; align-items: center; gap: 10px; margin-bottom: 10px; }
.mi-top .small { flex: none; }
.mi-item { padding: 14px; }
.mi-item-name { display: flex; align-items: baseline; flex-wrap: wrap; gap: 6px; font-size: 22px; font-weight: 900; line-height: 1.3; }
.mi-item-e { font-size: 26px; }
.mi-unit { font-size: 14px; font-weight: 700; color: var(--text-sub); }
.mi-tag { width: 100%; height: auto; display: block; margin: 6px 0; }
.mi-tag-y { font-size: 13px; fill: var(--text-sub); font-weight: 700; }
.mi-tag-p { font-size: 28px; font-weight: 900; fill: var(--text); }
.mi-tag-now { fill: var(--accent); font-size: 32px; }
.mi-tag-u { font-size: 14px; }
.mi-ask { font-size: 20px; font-weight: 900; text-align: center; margin: 14px 0 10px; }
.mi-choices { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.mi-choice { min-height: 64px; font-size: 22px; font-weight: 900; font-variant-numeric: tabular-nums; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px; padding: 8px 4px; }
.mi-choice:disabled { cursor: default; opacity: 1; }
.mi-ck { font-size: 11px; font-weight: 700; color: var(--text-sub); }
.mi-ans { margin-top: 12px; border: 2px solid var(--line); }
.mi-verdict { font-size: 22px; font-weight: 900; margin: 0; }
.mi-verdict.ok { color: var(--mi-ok); }
.mi-verdict.ng { color: var(--bad); }
.mi-curve { width: 100%; height: auto; display: block; }
.mi-axis { stroke: var(--line); }
.mi-past { stroke: var(--text-sub); stroke-width: 2.5; fill: none; }
.mi-proj { stroke: var(--accent); stroke-width: 3; fill: none; }
.mi-lin { stroke: var(--mi-lin); stroke-width: 2; stroke-dasharray: 5 4; fill: none; }
.mi-dot { fill: var(--text-sub); }
.mi-dot-t { fill: var(--accent); }
.mi-lbl-t { font-size: 12px; font-weight: 800; fill: var(--accent); }
.mi-tick { font-size: 9px; fill: var(--text-sub); }
.mi-next { margin-top: 12px; }

/* レア */
.mi-receipt { text-align: center; border: 2px dashed var(--accent); }
.mi-rc { background: var(--mi-tag-new); color: var(--text); font-family: monospace; text-align: left; max-width: 280px; margin: 10px auto; padding: 14px 16px; border-radius: 4px; box-shadow: var(--shadow); transform: rotate(-2deg); }
.mi-rc-h { font-weight: 900; color: var(--accent); margin-bottom: 6px; }
.mi-rc-row { display: flex; justify-content: space-between; gap: 8px; font-size: 14px; }
.mi-rc-f { font-size: 11px; color: var(--text-sub); border-top: 1px dashed var(--line); margin-top: 8px; padding-top: 6px; }

/* 結果 */
.mi-portrait { border-radius: var(--radius); overflow: hidden; box-shadow: var(--shadow); margin-bottom: 12px; line-height: 0; }
.mi-portrait img { width: 100%; height: auto; display: block; aspect-ratio: 1 / 1; object-fit: cover; }
.mi-main { border: 2px solid var(--accent); }
.mi-line { font-weight: 800; margin: 2px 0; }
.mi-big { font-size: clamp(44px, 14vw, 72px); font-weight: 900; color: var(--accent); line-height: 1.1; font-variant-numeric: tabular-nums; }
.mi-type { font-size: clamp(24px, 7vw, 32px); font-weight: 900; display: flex; flex-direction: column; align-items: center; gap: 4px; margin: 6px 0 4px; }
.mi-grid { font-size: 26px; letter-spacing: 3px; }
.mi-share { margin-top: 4px; }
.mi-two { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin: 10px 0 14px; }
.mi-two .btn { padding: 10px 8px; font-size: 14px; white-space: normal; line-height: 1.35; min-width: 0; }
.mi-wage .stat b { font-size: 20px; }
.mi-list { list-style: none; margin: 8px 0 4px; padding: 0; }
.mi-list li { display: grid; grid-template-columns: 1.4em minmax(0, 1.3fr) minmax(0, 1fr) auto; gap: 6px; align-items: center; font-size: 13px; padding: 4px 0; border-bottom: 1px dashed var(--line); }
.mi-li-bar { height: 8px; background: var(--surface-2); border-radius: 999px; overflow: hidden; }
.mi-li-bar > span { display: block; height: 100%; background: var(--accent); }
.mi-crow { display: grid; grid-template-columns: 8.5em 1fr auto; gap: 8px; align-items: center; margin-top: 6px; font-size: 13px; }
.mi-cbar { height: 10px; background: var(--surface-2); border-radius: 999px; overflow: hidden; }
.mi-cbar > span { display: block; height: 100%; background: var(--text-sub); }
.mi-crow.is-me .mi-cbar > span { background: var(--accent); }
.mi-crow.is-me b, .mi-crow.is-me span { color: var(--accent); }
.mi-public { margin-top: 12px; }
.mi-plist { margin: 4px 0 0; padding-left: 1.2em; font-size: 14px; }
.mi-sources summary { font-weight: 700; }
.mi-sources ul { padding-left: 1.2em; }

/* 図鑑 */
.mi-zk-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); gap: 8px; }
.mi-zk { background: var(--surface-2); border-radius: var(--radius-sm); padding: 8px; text-align: center; font-size: 12px; display: flex; flex-direction: column; align-items: center; gap: 2px; opacity: .6; }
.mi-zk.on { opacity: 1; background: var(--surface); border: 1px solid var(--line); }
.mi-zk-e { font-size: 24px; }

/* 解説 */
.mi-about h2 { font-size: 18px; margin-top: 8px; }
.mi-about p, .mi-about li { font-size: 14px; }
.mi-table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.mi-table { width: 100%; border-collapse: collapse; font-size: 12px; }
.mi-table th, .mi-table td { border-bottom: 1px solid var(--line); padding: 6px 4px; text-align: left; vertical-align: top; }
.mi-table th { color: var(--text-sub); white-space: nowrap; }
.mi-table a { word-break: break-all; }

@media (prefers-reduced-motion: reduce) { .mi-year { animation: none; } }
.ai-note { margin: 4px 0 8px; text-align: right; }