.skill-preview-column { min-width: 0; }
.skill-preview-stage { padding: 16px 12px; max-height: 72vh; overflow: auto; background: var(--field); }
#skill-preview { display: block; width: 100%; height: auto; touch-action: none; }
.skill-mode { display: flex; gap: 10px; align-items: center; font-size: 13px; }
.skill-mode select { width: 110px; }
.skill-editor .editor-scroll { display: block; overflow: visible; }
.skill-field { display: block; margin-top: 22px; }
.skill-field input,.skill-field select,.skill-field textarea,.skill-editor input[type=text],#skill-name { margin-top: 8px; }
.skill-effect-editor { margin-top: 26px; padding-top: 22px; border-top: 1px solid var(--line); }
.skill-effect-heading { display: flex; justify-content: space-between; align-items: center; margin-bottom: 12px; }
.quality-label { color: var(--tier-color); border: 1px solid var(--tier-color); border-radius: 4px; padding: 4px 10px; font-size: 12px; }
#skill-effect { width: 100%; min-height: 130px; line-height: 1.8; padding: 14px; font-size: 15px; }
.skill-list-panel { margin-top: 24px; padding: 20px; border: 1px solid var(--line); border-radius: 9px; background: var(--panel); }
.skill-list-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.skill-list-heading h2 { font-size: 18px; margin: 0; }
.skill-list-panel > p { font-size: 12px; line-height: 1.7; }
.skill-list-row { display: flex; gap: 8px; align-items: center; border: 1px solid var(--line); padding: 10px; margin-top: 10px; border-radius: 6px; }
.skill-list-row.active { border-color: var(--gold); }
.skill-list-edit { flex: 1; min-width: 0; text-align: left; background: none; border: 0; font-size: 14px; padding: 5px; }
.skill-list-edit small { display: block; margin-top: 4px; color: var(--muted); font-size: 11px; }
.skill-row-tools { display: flex; gap: 4px; }
.skill-row-tools button { font-size: 12px; padding: 6px; min-width: 26px; }
#skill-export-dialog { width: min(940px,calc(100vw - 28px)); }
.skill-export-stage { max-height: 56vh; overflow: auto; background: var(--field); border-radius: 6px; padding: 12px; }
#skill-export-preview { display: block; max-width: 100%; width: 100%; height: auto; }
#skill-export-dialog > .field-row,#skill-export-dialog > .check-label { margin-top: 16px; }
#skill-export-status { font-size: 13px; color: var(--muted); }
#skill-export-status.error { color: #e87c75; }
@media(max-width: 1150px) { .skill-preview-stage { max-height: 65vh; } }
@media(max-width: 480px) { .skill-list-panel { padding: 14px; } .skill-list-row { flex-wrap: wrap; } .skill-row-tools { margin-left: auto; } }
