/* ---------- 心と体・雇用形態 ---------- */
.hud-2 { display: grid; gap: 6px; margin-top: -6px; font-size: 13px; }
.hud-row { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.meters { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; }
.meter { position: relative; min-width: 0; }
.meter i { flex: 1; min-width: 0; }
.meter .pop { position: absolute; right: 0; top: -14px; font-style: normal; font-size: 12px; opacity: 0; pointer-events: none; text-shadow: 0 2px 0 #000; }
.meter .pop.go { animation: dpop 1.4s ease-out 1; }
.meter .pop.neg { color: #ff8a7a; }
.meter .pop.pos { color: #8af0a8; }
@keyframes dpop { 0% { opacity: 0; transform: translateY(6px); } 15% { opacity: 1; transform: none; } 80% { opacity: 1; } 100% { opacity: 0; transform: translateY(-6px); } }
.meter.anger i { background: linear-gradient(90deg, #e8783a var(--v, 0%), #0c0e24 var(--v, 0%)); }
.meter.anger.hot i { background: linear-gradient(90deg, #ff3a2a var(--v, 0%), #0c0e24 var(--v, 0%)); animation: blink .7s steps(2) infinite; }
.chip { font-size: 13px; padding: 1px 8px; border: 2px solid #07081a; background: var(--paper); color: var(--ink); }
.chip[data-job="none"] { background: var(--shu); color: #fff; }
.chip[data-job="leave"] { background: #6a6e88; color: #fff; }
.chip[data-job="jail"] { background: #2a2c38; color: #e8e4d8; box-shadow: inset 0 0 0 1px #8a8e9c; }
.chip[data-job="nonreg"] { background: #c8c0a8; }
.meter { display: flex; align-items: center; gap: 5px; }
.meter span { color: var(--sub); }
.meter i { width: auto; height: 9px; border: 2px solid #07081a; background: linear-gradient(90deg, #5ac87a var(--v, 50%), #0c0e24 var(--v, 50%)); box-shadow: 0 2px 0 #07081a; }
.meter.mid i { background: linear-gradient(90deg, #f0b840 var(--v, 50%), #0c0e24 var(--v, 50%)); }
.meter.low i { background: linear-gradient(90deg, #e8483a var(--v, 50%), #0c0e24 var(--v, 50%)); animation: blink 1.4s steps(2) infinite; }
.family { color: var(--sub); }
.offer { margin: 0; font-size: 13px; color: var(--sub); }
.mods { display: flex; flex-wrap: wrap; gap: 6px; }
.mod { font-size: 12px; padding: 2px 8px; border: 2px solid #07081a; }
.mod.bad { background: #5a1e2a; color: #ffd0c8; }
.mod.good { background: #5a4a14; color: #ffe9a0; }
.mod.warn { background: #3a3e6a; color: #dfe4ff; }
.draw-rates .hop { color: #ffb8a8; }
.offer b { color: var(--fluor); font-weight: 400; }
.nojob { display: grid; grid-template-columns: 80px 1fr; gap: 12px; align-items: center; border-top: 1px solid var(--rule); padding-top: 10px; }
.nojob img { width: 80px; height: 80px; border: 2px solid var(--ink); }
.nojob p { margin: 0; font-size: 14px; }
.nojob p b { font-weight: 800; color: var(--shu); }
.nojob .small { font-size: 12px; color: var(--ink-2); margin-top: 4px; }
.career li.hv .dark { color: #ffb4a6; }
.warn { border: 2px solid var(--line); padding: 12px 14px; display: grid; gap: 8px; }
.warn h2 { margin: 0; font-size: 15px; font-weight: 400; }
.warn p { margin: 0; font-size: 13px; line-height: 1.75; color: var(--sub); }
.mode { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; }
.mode button { background: var(--void-2); border: 2px solid var(--line); padding: 8px; display: flex; flex-direction: column; align-items: center; gap: 2px; color: var(--sub); }
.mode button b { font-weight: 400; font-size: 15px; }
.mode button small { font-size: 11px; }
.mode button[aria-pressed="true"] { background: var(--paper); color: var(--ink); border-color: #07081a; box-shadow: 0 3px 0 #07081a; }