.character-panel{max-width:720px;margin:10px auto 0;display:grid;grid-template-columns:1.35fr 1.15fr .75fr .75fr auto;gap:7px;padding:9px;background:linear-gradient(180deg,#18130e,#100d09);border:1px solid var(--line);border-radius:8px}.character-panel>label{display:flex;flex-direction:column;justify-content:center;padding:5px 8px;background:#0c0a07;border:1px solid #2b2117;border-radius:5px}.character-panel>label>span,.class-picker small{font-size:8px;color:var(--muted);letter-spacing:.08em}.character-panel>label>input{width:100%;background:transparent;border:0;outline:0;color:var(--text);font-weight:700;margin-top:3px}.class-picker{display:grid;grid-template-columns:40px 1fr auto;align-items:center;gap:8px;background:#131b0d;border:1px solid #466629;border-radius:6px;color:var(--text);text-align:left;padding:5px 8px}.class-picker>span:first-child{width:38px;height:38px;display:grid;place-items:center;border-radius:50%;background:radial-gradient(circle,#3b5822,#14200c);border:1px solid var(--green);color:var(--gold);font-family:Georgia;font-size:22px}.class-picker b,.class-picker small{display:block}.class-picker i{color:var(--copper)}.character-level div{display:flex;align-items:center}.character-level button{border:0;background:transparent;color:var(--copper);padding:2px 5px}.character-level input{min-width:40px;text-align:center}.prices-btn{border:1px solid var(--warm);background:#20170f;color:var(--gold);border-radius:6px;padding:5px 10px;font-size:10px}.prices-btn small{display:block;color:var(--muted);font-size:7px}.class-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin-top:12px}.class-option{display:flex;align-items:center;gap:7px;background:#100d09;border:1px solid var(--line);color:var(--sec);border-radius:6px;padding:7px;text-align:left}.class-option.active{border-color:var(--green);color:var(--lime)}.class-option i{width:26px;height:26px;display:grid;place-items:center;border-radius:50%;background:#1c2911;font-style:normal;color:var(--gold)}
@media(max-width:820px){.character-panel{grid-template-columns:1fr 1fr;margin-top:8px}.class-picker{grid-column:1}.character-level{grid-column:2}.prices-btn{grid-column:1/-1;padding:8px}.class-grid{grid-template-columns:1fr 1fr}}
.class-option{min-height:58px;padding:4px 7px;overflow:hidden}.class-option img{width:42px;height:52px;object-fit:contain;object-position:center;filter:drop-shadow(0 3px 3px #000)}.class-option.active{background:#15200e}
