/* Existing character editor, neutral SPHERE typography and controls. */
#sphere-view #sph-left-elements { font:400 14px/1.5 Inter,Pretendard,sans-serif; color:#ededed; }
#sphere-view #sph-left-elements #sph-el-list { padding-block:12px; }
#sphere-view #sph-left-elements .sph-character-heading { display:flex; flex-direction:column; gap:3px; margin:0 0 12px; }
#sphere-view #sph-left-elements .sph-character-heading b { font-size:14px; font-weight:600; }
#sphere-view #sph-left-elements .sph-character-heading span { color:#aaa; font-size:12px; }
#sphere-view #sph-left-elements .sph-character-counts { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:6px; }
#sphere-view #sph-left-elements .sph-character-counts>div { display:flex; flex-direction:column; gap:2px; padding:10px; background:#272727; border-radius:7px; }
#sphere-view #sph-left-elements .sph-character-counts b { font-size:18px; font-weight:600; line-height:1.3; }
#sphere-view #sph-left-elements .sph-character-counts span { font-size:12px; color:#b3b3b3; }
#sphere-view #sph-left-elements :is(.sph-character-count-detail,.sph-character-library) { margin:10px 0; color:#aaa; font-size:12px; }
#sphere-view #sph-left-elements :is(.sph-character-count-detail,.sph-character-library) summary { cursor:pointer; padding:5px 0; }
#sphere-view #sph-left-elements .sph-character-library { padding:8px 10px; background:#272727; border-radius:7px; }
#sphere-view #sph-left-elements .sph-character-library summary { color:#ddd; font-size:14px; }
#sphere-view #sph-left-elements .sph-character-library summary span { font-size:12px; color:#aaa; margin-left:6px; }
#sphere-view #sph-left-elements :is(.sphu-help,.sph-character-count-detail p,.sph-character-ref-note,.sph-character-notice) { font:400 12px/1.6 Inter,Pretendard,sans-serif; color:#aaa; white-space:normal; overflow-wrap:anywhere; }
#sphere-view #sph-left-elements .sph-character-ref-note { margin:14px 0 8px; }
#sphere-view #sph-left-elements .sph-character-card { display:grid; grid-template-columns:32px minmax(0,1fr) 28px; gap:5px 8px; align-items:start; padding:12px; margin-bottom:10px; border:1px solid #303030; background:#272727; border-radius:8px; }
#sphere-view #sph-left-elements .sph-character-card:hover { background:#2b2b2b; }
#sphere-view #sph-left-elements .sph-character-card .sph-el-thumb { grid-column:1; grid-row:1/4; width:32px; height:32px; background:#1e1e1e; color:#aaa; }
#sphere-view #sph-left-elements .sph-el-meta { display:contents; }
#sphere-view #sph-left-elements .sph-el-meta>b { grid-column:2; font-size:14px; font-weight:600; line-height:1.45; overflow-wrap:anywhere; }
#sphere-view #sph-left-elements .sph-el-meta>small { grid-column:2/4; font-size:12px; color:#aaa; line-height:1.5; white-space:normal; overflow-wrap:anywhere; }
#sphere-view #sph-left-elements .sph-el-meta em { color:#bbb; font-size:12px; background:#303030; }
#sphere-view #sph-left-elements [data-sph-el-ref] { grid-column:3; grid-row:1; width:28px; height:28px; border:0; background:#303030; color:#ccc; border-radius:5px; }
#sphere-view #sph-left-elements [data-sph-el-model-editor] { grid-column:1/-1; margin-top:7px; padding-top:9px; border-top:1px solid #383838; }
#sphere-view #sph-left-elements [data-sph-el-model-editor] summary { font-size:14px; color:#ddd; line-height:1.5; }
#sphere-view #sph-left-elements [data-sph-el-model-editor] label { font:400 12px/1.5 Inter,Pretendard,sans-serif; margin:10px 0; color:#aaa; }
#sphere-view #sph-left-elements [data-sph-el-model-editor] select { display:block; margin-top:5px; height:36px; padding:6px 10px; font:400 14px/1.4 Inter,Pretendard,sans-serif; color:#ededed; background:#1e1e1e; border:1px solid #383838; border-radius:6px; }
#sphere-view #sph-left-elements .sphu-btn { min-height:34px; padding:6px 10px; font:500 14px/1.4 Inter,Pretendard,sans-serif; color:#ddd; border:1px solid #383838; background:#303030; border-radius:6px; white-space:normal; }
#sphere-view #sph-left-elements [data-sph-el-feedback] { font-size:12px; color:#bbb; }
#sphere-view #sph-left-elements .sphu-left-foot { display:grid; grid-template-columns:minmax(0,1.8fr) minmax(0,1fr) 34px; gap:6px; width:100%;box-sizing:border-box;padding:10px 12px 12px; background:#1e1e1e;flex:none; }
#sphere-view #sph-left-elements .sphu-left-foot .sphu-btn { display:flex;align-items:center;justify-content:center;gap:4px;width:100%;min-width:0;min-height:34px;padding:6px 3px;white-space:nowrap;font-size:14px;grid-row:1; }
#sphere-view #sph-left-elements #sph-el-import { grid-column:1; }
#sphere-view #sph-left-elements #sph-el-add { grid-column:2; }
#sphere-view #sph-left-elements #sph-el-refresh { grid-column:3; padding-inline:0; }
#sphere-view #sph-left-elements :is(button,input,select,summary):focus-visible { outline:1px solid #d0d0d0; outline-offset:2px; box-shadow:none; }
