.creature-card{border:1px solid var(--border-default);border-radius:6px;background:var(--bg-surface);padding:16px;transition:border-color .15s var(--ease-out),box-shadow .15s var(--ease-out)}.creature-card.active-turn{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-tint-strong)}.hp-bar-track{width:100%;height:6px;background:var(--border-default);border-radius:100px;overflow:hidden}.hp-bar-fill{height:100%;border-radius:100px;transition:width .3s var(--ease-out),background-color .3s var(--ease-out)}.condition-pill{font-family:var(--font-mono);font-size:10px;letter-spacing:.06em;text-transform:uppercase;padding:3px 8px;border-radius:100px;border:1px solid var(--border-default);background:transparent;color:var(--text-muted);cursor:pointer;transition:all .15s var(--ease-out)}.condition-pill:hover{border-color:var(--border-strong)}.condition-pill.on{border-color:var(--accent);background:var(--accent-tint);color:var(--accent)}.hp-input{width:60px;border:1px solid var(--border-default);border-radius:4px;background:var(--bg-surface);padding:4px 8px;font-family:var(--font-mono);font-size:12px;color:var(--text-body);text-align:center}.hp-input:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-tint-strong)}.hp-action-btn{font-family:var(--font-mono);font-size:11px;padding:4px 10px;border-radius:4px;border:1px solid var(--border-default);background:var(--bg-surface);color:var(--text-secondary);cursor:pointer;transition:all .15s var(--ease-out)}.hp-action-btn:hover{border-color:var(--border-strong);color:var(--text-body)}.remove-btn{font-family:var(--font-mono);font-size:10px;letter-spacing:.06em;text-transform:uppercase;padding:3px 8px;border-radius:4px;border:1px solid var(--border-default);background:transparent;color:var(--text-muted);cursor:pointer;transition:all .15s var(--ease-out)}.remove-btn:hover{border-color:var(--border-strong);color:var(--text-body)}.init-badge{width:40px;height:40px;border-radius:6px;border:1px solid var(--border-default);background:var(--bg-strip);display:inline-flex;align-items:center;justify-content:center;font-family:var(--font-mono);font-size:16px;font-weight:600;color:var(--text-body);flex-shrink:0}.active-turn .init-badge{background:var(--accent);color:var(--bg-page);border-color:var(--accent)}.ac-badge{font-family:var(--font-mono);font-size:11px;padding:2px 8px;border-radius:100px;border:1px solid var(--border-default);color:var(--text-muted);white-space:nowrap}.add-mode-tab{background:transparent;border:0;padding:6px 10px;border-radius:100px;font-family:var(--font-mono);font-size:10px;font-weight:500;text-transform:uppercase;letter-spacing:.14em;color:var(--text-muted);cursor:pointer;transition:background .15s var(--ease-out),color .15s var(--ease-out)}.add-mode-tab.is-active{background:var(--accent-tint);color:var(--accent)}.add-mode-tab:focus-visible{outline:0;box-shadow:0 0 0 3px var(--accent-tint-strong)}#add-form-srd{display:none}#add-form-srd.is-active{display:flex}.srd-results{max-height:200px;overflow-y:auto;border:1px solid var(--border-default);border-radius:6px;background:var(--bg-surface)}.srd-result-item{width:100%;text-align:left;background:transparent;border:0;padding:8px 12px;font-family:var(--font-display);font-size:14px;color:var(--text-body);cursor:pointer;display:flex;justify-content:space-between;align-items:baseline;gap:8px;transition:background .1s var(--ease-out)}.srd-result-item:hover,.srd-result-item.is-selected{background:var(--accent-tint);color:var(--accent)}.srd-result-item .srd-result-cr{font-family:var(--font-mono);font-size:10px;text-transform:uppercase;letter-spacing:.1em;color:var(--text-muted)}.srd-result-item.is-selected .srd-result-cr{color:var(--accent)}.faq-toggle{background:none;border:none;padding:0;text-align:left;cursor:pointer;width:100%;display:flex;justify-content:space-between;align-items:center}.faq-icon{font-family:var(--font-mono);font-size:18px;color:var(--text-muted);width:20px;height:20px;display:inline-flex;align-items:center;justify-content:center;transition:transform .3s var(--ease-spring),color .2s var(--ease-out);flex-shrink:0}.faq-item.open .faq-icon{color:var(--accent);transform:rotate(45deg)}.faq-answer{max-height:0;opacity:0;overflow:hidden;transition:max-height .35s var(--ease-out),opacity .25s var(--ease-out)}.faq-item.open .faq-answer{max-height:200px;opacity:1}