/* The Stormlands hero: creation form, hero chip, XP bar, virtue badges. Shared by landing + game pages. */
.hf-name{display:block;font-family:Cinzel,Georgia,serif;font-size:15px;letter-spacing:.08em;color:var(--gold-bright)}
.hf-name input{display:block;width:100%;margin-top:6px;background:#0a0f1a;border:1px solid var(--line);color:var(--ink);
  border-radius:8px;padding:11px 12px;font:inherit;font-family:'Trebuchet MS',sans-serif;font-size:17px;letter-spacing:0}
.hf-label{margin:16px 0 8px;font-family:Cinzel,Georgia,serif;font-size:15px;letter-spacing:.08em;color:var(--gold-bright)}
.hf-classes{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.hf-class{display:flex;flex-direction:column;align-items:center;gap:4px;text-align:center;background:rgba(255,255,255,.04);
  border:1px solid var(--line);border-radius:12px;padding:12px 8px;color:var(--ink);cursor:pointer;font:inherit;transition:all .15s}
.hf-class:hover{border-color:var(--gold)}
.hf-class.on{border-color:var(--gold-bright);background:rgba(217,174,78,.16);box-shadow:0 0 16px rgba(240,201,107,.25)}
.hf-icon{font-size:28px;line-height:1.1}
.hf-class b{font-family:Cinzel,Georgia,serif;font-size:16px}
.hf-class small{color:var(--ink-dim);font-size:12.5px;line-height:1.3}
.hf-go{margin-top:16px;background:var(--gold);color:#1a1200;border:0;border-radius:8px;padding:12px 20px;font:inherit;font-weight:700;cursor:pointer}
.hf-msg{min-height:1.3em;margin-top:8px;color:var(--gold-bright);font-size:14px}
@media (max-width:560px){.hf-classes{grid-template-columns:repeat(2,1fr)}}

.chip-hero{display:flex;align-items:center;gap:10px}
.chip-hero .ic{font-size:26px}
.chip-hero b{font-family:Cinzel,Georgia,serif;font-size:17px;display:block;line-height:1.2}
.chip-hero small{color:var(--ink-dim);font-size:13px}
.xpbar{height:7px;border-radius:99px;background:rgba(255,255,255,.08);overflow:hidden;margin-top:8px}
.xpbar i{display:block;height:100%;background:linear-gradient(90deg,var(--gold),var(--gold-bright));border-radius:99px}
.virtues{display:flex;flex-wrap:wrap;gap:5px;margin-top:10px}
.virtue{font-size:11.5px;letter-spacing:.07em;text-transform:uppercase;border:1px solid var(--gold);color:var(--gold-bright);
  border-radius:4px;padding:1px 7px;background:rgba(217,174,78,.1)}