.ai_skill_manage_view{
  display:none;
  flex:1;
  min-width:0;
  min-height:0;
  background:#f6f7f9;
}

.ai_skill_manage_view.active{
  display:flex;
}

.ai_skill_manage_app{
  flex:1;
  min-width:0;
  min-height:0;
  display:flex;
  flex-direction:column;
  border:1px solid #e5e7eb;
  border-radius:18px;
  background:#fff;
  overflow:hidden;
}

.ai_skill_manage_header{
  flex:0 0 auto;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  padding:20px 24px;
  border-bottom:1px solid #eef2f7;
}

.ai_skill_manage_header p,
.ai_skill_form_head p{
  margin:0 0 4px;
  color:#64748b;
  font-size:12px;
  font-weight:800;
  letter-spacing:.03em;
}

.ai_skill_manage_header h1,
.ai_skill_form_head h2{
  margin:0;
  color:#0f172a;
  font-size:20px;
  font-weight:800;
}

.ai_skill_manage_actions,
.ai_skill_form_footer,
.ai_skill_form_footer div{
  display:flex;
  align-items:center;
  gap:10px;
}

.ai_skill_manage_actions button,
.ai_skill_form_footer button{
  min-height:34px;
  padding:0 13px;
  border:1px solid #d1d5db;
  border-radius:999px;
  background:#fff;
  color:#334155;
  cursor:pointer;
  font-size:13px;
  font-weight:800;
}

.ai_skill_manage_actions button.is-primary,
.ai_skill_form_footer button.is-primary{
  border-color:#0f172a;
  background:#0f172a;
  color:#fff;
}

.ai_skill_manage_body{
  flex:1;
  min-height:0;
  display:grid;
  grid-template-columns:340px minmax(0,1fr);
}

.ai_skill_list_panel{
  min-width:0;
  min-height:0;
  display:flex;
  flex-direction:column;
  border-right:1px solid #e5e7eb;
  background:#f8fafc;
}

.ai_skill_list_head{
  flex:0 0 auto;
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:10px;
  padding:16px;
  color:#0f172a;
}

.ai_skill_list_head span{
  color:#94a3b8;
  font-size:13px;
  font-weight:800;
}

.ai_skill_list{
  flex:1;
  min-height:0;
  display:grid;
  align-content:start;
  gap:8px;
  overflow:auto;
  padding:0 12px 16px;
}

.ai_skill_item{
  min-width:0;
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:8px;
  align-items:center;
  padding:11px 12px;
  border:1px solid transparent;
  border-radius:12px;
  background:transparent;
  color:#334155;
  cursor:pointer;
  text-align:left;
}

.ai_skill_item:hover{
  background:#eef2f7;
}

.ai_skill_item.is-active{
  border-color:#dbeafe;
  background:#eff6ff;
  color:#0f172a;
}

.ai_skill_item strong,
.ai_skill_item span{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.ai_skill_item strong{
  display:block;
  font-size:14px;
  font-weight:800;
}

.ai_skill_item span{
  display:block;
  margin-top:3px;
  color:#64748b;
  font-size:12px;
}

.ai_skill_item code{
  max-width:110px;
  overflow:hidden;
  text-overflow:ellipsis;
  padding:4px 7px;
  border-radius:999px;
  background:#e2e8f0;
  color:#475569;
  font-size:11px;
}

.ai_skill_editor_panel{
  min-width:0;
  min-height:0;
  overflow:auto;
  padding:22px;
}

.ai_skill_form{
  max-width:920px;
  display:grid;
  gap:18px;
}

.ai_skill_form_head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
}

.ai_skill_form_head span{
  padding:6px 10px;
  border:1px solid #d1d5db;
  border-radius:999px;
  color:#64748b;
  font-size:12px;
  font-weight:800;
}

.ai_skill_form_grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:14px;
}

.ai_skill_form label{
  display:grid;
  gap:7px;
  color:#475569;
  font-size:13px;
  font-weight:800;
}

.ai_skill_form input[type="text"],
.ai_skill_form select,
.ai_skill_form textarea{
  width:100%;
  border:1px solid #d1d5db;
  border-radius:12px;
  background:#fff;
  color:#0f172a;
  font:14px/1.55 Inter, system-ui, -apple-system, "Segoe UI", "PingFang SC", "Microsoft YaHei", sans-serif;
  outline:none;
}

.ai_skill_form input[type="text"],
.ai_skill_form select{
  height:40px;
  padding:0 12px;
}

.ai_skill_form textarea{
  resize:vertical;
  padding:10px 12px;
}

.ai_skill_form input:focus,
.ai_skill_form select:focus,
.ai_skill_form textarea:focus{
  border-color:#2563eb;
  box-shadow:0 0 0 3px rgba(37,99,235,.12);
}

.ai_skill_full{
  min-width:0;
}

.ai_skill_switches{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
}

.ai_skill_switches label{
  display:inline-flex;
  grid-template-columns:none;
  align-items:center;
  gap:8px;
  padding:8px 10px;
  border:1px solid #e5e7eb;
  border-radius:999px;
  background:#f8fafc;
}

.ai_skill_form_footer{
  justify-content:space-between;
  padding-top:4px;
}

@media (max-width: 980px){
  .ai_skill_manage_body{
    grid-template-columns:1fr;
  }

  .ai_skill_list_panel{
    max-height:280px;
    border-right:0;
    border-bottom:1px solid #e5e7eb;
  }

  .ai_skill_form_grid{
    grid-template-columns:1fr;
  }
}