.character-trigger { display:flex; align-items:center; gap:12px; width:100%; max-width:410px; margin:14px 0 0; padding:9px 13px 9px 8px; color:#f6efd2; background:rgba(12,31,20,.74); border:1px solid rgba(198,224,179,.25); border-radius:12px; text-align:left; cursor:pointer; font:inherit; }
.character-trigger:hover,.character-trigger:focus-visible { border-color:#7bd37f; background:rgba(23,51,33,.95); }
.character-trigger-portrait { display:grid; place-items:center; flex:0 0 54px; height:54px; background:rgba(123,211,127,.12); border-radius:8px; overflow:hidden; font-size:30px; }
.character-trigger-portrait img { width:100%; height:100%; object-fit:contain; }
.character-trigger-text { display:flex; flex:1; flex-direction:column; gap:3px; }
.character-trigger-text small { font-size:9px; letter-spacing:1.5px; color:#b8c8a8; }
.character-trigger-text b { font-size:16px; }
.character-trigger-change { color:#a9d49e; font-size:11px; }
.character-modal { z-index:120; padding:22px; }
.character-dialog { width:min(890px,96vw); max-height:calc(100dvh - 44px); overflow-y:auto; background:linear-gradient(135deg,#193a28,#0d2017); border:1px solid #527c4c; border-radius:22px; color:#f6efd2; box-shadow:0 30px 100px #0008; padding:26px; }
.character-header { display:flex; align-items:center; justify-content:space-between; gap:15px; margin-bottom:18px; }
.character-header h2 { margin:4px 0 0; font-size:30px; line-height:1.15; }
.character-header .close { position:static; flex-shrink:0; }
.character-body { display:grid; grid-template-columns:minmax(210px,.9fr) minmax(260px,1fr); gap:22px; }
.character-preview { position:relative; height:390px; border-radius:16px; overflow:hidden; background:radial-gradient(ellipse at 50% 45%,#527145 0%,#263e2b 42%,#13281d 80%); border:1px solid #436442; }
.character-preview-canvas { width:100%; height:100%; display:block; }
.character-preview-name { position:absolute; top:18px; left:18px; z-index:1; letter-spacing:2px; font-size:18px; }
.character-preview-status { position:absolute; bottom:15px; left:12px; right:12px; font-size:10px; color:#c4d4b4; text-align:center; background:#10291bcc; padding:7px; border-radius:6px; }
.character-roster { display:flex; flex-direction:column; gap:9px; }
.character-choice { position:relative; width:100%; display:flex; align-items:center; gap:12px; padding:7px 13px 7px 7px; min-height:70px; text-align:left; border:1px solid #4d64444d; border-radius:11px; background:#14281e; color:#f6efd2; font:inherit; cursor:pointer; transition:border-color .15s,background .15s; }
.character-choice:hover,.character-choice:focus-visible { background:#294b33; border-color:#8bb97a; }
.character-choice.selected { background:#32553a; border-color:#90d381; box-shadow:0 0 0 1px #90d38133 inset; }
.character-portrait { flex:0 0 56px; height:56px; display:grid; place-items:center; overflow:hidden; background:#93be7130; border-radius:7px; }
.character-portrait img { width:100%; height:100%; object-fit:contain; }
.character-farmer-icon { font-size:36px; }
.character-choice-text { display:flex; flex:1; flex-direction:column; gap:5px; }
.character-choice-text b { font-size:14px; letter-spacing:.4px; }
.character-choice-text small { font-size:10px; line-height:1.25; color:#bfcdae; }
.character-check { visibility:hidden; font-size:21px; color:#a7ef9a; }
.selected .character-check { visibility:visible; }
.character-footer { display:flex; align-items:center; justify-content:space-between; gap:20px; margin-top:20px; }
.character-footer p { margin:0; max-width:320px; color:#b2c4a5; font-size:11px; line-height:1.5; }
.character-footer .pbtn { width:auto; margin:0; padding:13px 20px; white-space:nowrap; }
@media(max-width:640px) { .character-modal{padding:12px}.character-dialog{padding:18px;width:100%;max-height:calc(100dvh - 24px)}.character-header h2{font-size:23px}.character-body{grid-template-columns:1fr;gap:12px}.character-preview{height:230px}.character-roster{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:5px}.character-choice{flex-direction:column;min-height:100px;gap:6px;padding:6px 3px;text-align:center}.character-portrait{flex:auto;width:50px;height:50px}.character-choice-text{gap:0}.character-choice-text b{font-size:8px;letter-spacing:0}.character-choice-text small{display:none}.character-check{position:absolute;top:3px;right:3px;font-size:12px}.character-footer{gap:12px;margin-top:14px}.character-footer p{font-size:9px}.character-footer .pbtn{padding:12px;font-size:12px} }
@media(max-height:660px) and (min-width:641px){.character-preview{height:310px}.character-dialog{padding:18px}.character-choice{min-height:55px;padding:4px 9px;gap:10px}.character-portrait{height:46px;flex-basis:46px}.character-footer{margin-top:14px}}