/* Character sheet, achievements, save tab, tooltip, toast. */
.gr-stat-head { margin: 8px 0 0; padding: 4px 12px; font: 700 15px var(--font-game); color: var(--gold); text-shadow: var(--ink); border-bottom: 1px solid #3a3226; }
.gr-stat { display: flex; justify-content: space-between; gap: 12px; padding: 5px 12px; font: 14px var(--font-game); }
.gr-stat.alt { background: rgba(255,255,255,.05); }
.gr-stat span { color: var(--text); } .gr-stat b { color: #fff; text-align: right; }

.achievements { list-style: none; margin: 0; padding: 4px; max-height: 440px; overflow-y: auto; display: grid; grid-template-columns: 1fr 1fr; gap: 4px; }
.achievements li { display: flex; align-items: center; gap: 8px; padding: 4px; background: rgba(0,0,0,.3); opacity: .55; min-width: 0; }
.achievements li.got { opacity: 1; background: rgba(255,209,0,.07); }
.achievements li span:last-child { display: flex; flex-direction: column; min-width: 0; }
.achievements b { font: 700 13px var(--font-game); color: var(--gold-bright); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.achievements small { color: var(--muted); font-size: 11.5px; line-height: 1.25; }
.achievements li:not(.got) b { color: var(--muted); }

.row { display: flex; flex-wrap: wrap; gap: 8px; margin: 10px 0; }
#save-box { width: 100%; box-sizing: border-box; margin-top: 4px; padding: 6px 8px; border: 1px solid #3a3226; background: rgba(0,0,0,.55); color: var(--text); font: 12px monospace; resize: vertical; }
.gr-msg { min-height: 20px; font-size: 13px; } .gr-msg.ok { color: var(--green); } .gr-msg.bad { color: var(--bad); }
.gr-warn { margin-bottom: 8px; padding: 8px 10px; border: 1px solid var(--bad); background: rgba(120,0,0,.3); color: #ffb0a0; font-size: 13px; } .gr-warn[hidden] { display: none; }
.restore-list { list-style: none; margin: 6px 0 0; padding: 6px; }
.restore-list li { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 4px 2px; font-size: 12.5px; }
.restore-list li + li { border-top: 1px solid #2c241a; }

/* tooltip */
.gr-tooltip { position: fixed; z-index: 60; max-width: 300px; box-sizing: border-box; padding: 8px 10px; border: 2px solid #c8c8d0; border-radius: 4px; background: rgba(8,8,18,.96); box-shadow: 0 6px 18px rgba(0,0,0,.7); font: 13px/1.35 var(--font-game); color: #fff; pointer-events: none; }
.gr-tooltip[hidden] { display: none; }
.gr-tooltip > div + div { margin-top: 3px; }
.tt-title { font-weight: 700; font-size: 15px; color: #fff; }
.tt-title.q0 { color: var(--q0); } .tt-title.q2 { color: var(--q2); } .tt-title.q3 { color: #4aa3ff; } .tt-title.q4 { color: #c06cff; } .tt-title.q5 { color: var(--q5); } .tt-title.q-talent { color: var(--gold); }
.tt-gold { color: var(--gold); } .tt-green { color: var(--green); } .tt-line { color: #fff; } .tt-dim { color: var(--muted); } .tt-bad { color: var(--bad); }
.tt-flavor { color: #e0c070; font-style: italic; }
.tt-price { margin-top: 6px; } .tt-price.bad { color: var(--bad); }

.toast { position: fixed; left: 50%; bottom: 20px; transform: translateX(-50%); display: flex; gap: 10px; align-items: center; background: rgba(8,8,18,.96); border: 2px solid #c8c8d0; border-radius: 4px; padding: 10px 14px; box-shadow: 0 10px 30px rgba(0,0,0,.6); z-index: 70; max-width: calc(100vw - 32px); font: 14px var(--font-game); }
.toast[hidden] { display: none; } .toast b { color: var(--gold); } .toast img { flex: none; border: 1px solid #000; }

@media (max-width: 560px) { .achievements { grid-template-columns: 1fr; } }